/* CSS3 STYLESHEET FOR RUSLAN ULANOV's RESUME */
@import "http://fonts.googleapis.com/css?family=Reenie+Beanie&subset=latin";

/* BEGIN: GLOBAL STYLES */
.accessible {
    display: none;
}
html, body {
	margin: 0px;
	padding: 0px;
	font: normal large Georgia, Verdana, serif;
	color: #333;
}
section, article, header, footer, nav, aside, hgroup {
	display: block;
}
body {
	background-image: url(../images/desk5.jpg), url(../images/card2.png);
	background-repeat: no-repeat;
	background-position: left bottom, center 3em;
}
#container {
	margin: 0px;
	padding: 1em;
}
a, a:visited {
	-webkit-transition: all 1s;
	/*text-decoration: none;*/
	color: #444;
}
a:hover {
	color: #000099;
	text-shadow: 1px 1px 3px gray;
}
a[href$=".doc"], a[href$=".docx"] {
	background: url(../images/icon_msword.png) no-repeat;
	padding-left: 20px;
}
a[href$=".pdf"] {
	background: url(../images/icon_pdf.png) no-repeat;
	padding-left: 20px;
}
a[href$=".txt"] {
	background: url(../images/icon_text.png) no-repeat;
	padding-left: 20px;
}
a[href="#Top"] {
	display: block;
	float: right;
	text-transform: uppercase;
    text-decoration: none;
	vertical-align: baseline;
	text-align: right;
	color: black;
	padding:  1em 1em 0 2em;
	font-size: 60%;
	text-shadow: none;
}
a[href$="dublin-ca"] {
	background: url(../images/map-32x32.png) no-repeat;
	padding-left: 40px;
}
a[href^="mailto"] {
	background: url(../images/mail-32x32.png) no-repeat;
	padding-left: 40px;
}
a[href^="callto"] {
	background: url(../images/phone-32x32.png) no-repeat;
	padding-left: 40px;
}
a[href*="linkedin.com"] {
	background: url(../images/icon_linkedin.png) left no-repeat;
	padding-left: 100px;
	line-height: 40px;
}
ul li {
	list-style-type: circle;
}
blockquote {
	font-style: italic;
}
/* END: GLOBAL STYLES */

/* BEGIN: MAJOR STRUCTURAL BLOCKS */
#container>header {
	top: 1em;
	right: 1em;
	display: block;
	width: 500px;
	height: 280px;
	border: solid 2px silver;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	/*padding: 10px;*/
	margin: 20px auto;
	background-color: whitesmoke;
	/*background-color: rgba(245, 245, 245, .8);*/
	-webkit-box-shadow: 2px 2px 3px black;
	-moz-box-shadow: 2px 2px 3px black;
	-o-box-shadow: 2px 2px 3px black;
	box-shadow: 2px 2px 3px black;
	/*-webkit-transform-origin: 0;*/
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-webkit-transform: scale(.8) rotate(8deg);
	-moz-transform: scale(.8) rotate(8deg);
/*	-webkit-box-reflect: below 20px -webkit-gradient(linear left top, left bottom, from(transparent) to(rgba(255,255,255,0.5))); */
}

#container>header:hover {
	-webkit-transform: scale(1) rotate(0deg);
	-moz-transform: scale(1) rotate(0deg);
}

nav {
	display: block;
	min-width: 440px;
	margin: 40px 20px;
	padding: 1em 2em;
	background-color: white;
	border: solid 1px silver;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	font-weight: bold;
	line-height: .6em;
	/*border-top: inset 2px silver;*/
}

article#main {
	display: block;
	min-width: 440px;
	clear: both;
	border: solid 1px silver;
	background-color: white;
	margin: 40px 20px;
	text-shadow: 1px 1px 0px silver;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	padding: 1em 2em;
}

footer {
	display: block;
	min-width: 440px;
	margin: 40px 20px;
	padding: 1em 2em;
	border: solid 1px silver;
	background-color: white;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	margin-bottom: 50em;
	text-shadow: 1px 1px 2px silver;
}
/* END: MAJOR STRUCTURAL BLOCKS */

/* BEGIN: HEADER STYLES */
header h1 {
	font-weight: bold;
	line-height: 1em;
	margin: 6px 0 -6px 12px;
	font-size:266%;
	color: #444;
	text-shadow: 1px 1px 2px #eee,  -1px -1px 2px #111;
}
header h2 {
	font-size: 90%;
	font-style: italic;
	margin-left: 12px;
	text-shadow: 1px 1px 1px #ddd, -1px -1px 1px #555;
}
header a,
header a:visited {
	text-decoration: none;
	/*border: solid 1px transparent;*/
	/*margin-left: 5px;*/
	text-shadow: 1px 1px 1px silver;
	background-repeat: no-repeat;
	font-size: 28px;
	line-height: 80%;
}
header a:hover {
	/*text-decoration: underline;*/
	/*border: solid 1px #00f;*/
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	/*background-color: white;*/
}
header>figure>img {
	display: none;
}
header figure {
	display: block;
	float: right;
	width: 123px;
	height: 123px;
	margin-right:1em;
	margin-top: 2em;
	border: solid 1px #eee;
	/*background-image: url(http://www.gravatar.com/avatar/b53f14bceb6bd5be6d6b6b79cc8bc7bb?s=100&r=PG&d=identicon);*/
	background-image: url(../images/ruslan-ulanov-face-small-square.jpg);
	background-repeat: no-repeat;
	-webkit-border-radius: .5em;
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-background-clip: padding-box;
	/*-webkit-background-clip: content-box;*/
	/*-webkit-transition: opacity 500ms ease-out;
	opacity: 1;*/
	-webkit-transition: all 10s move-in;
}
header figure:hover {
	background-image: url(../images/vcard-ulanoff-info-small.png);
	background-repeat: no-repeat;
}
#contact_info {
	position: relative;
	margin-top: 3em;
	margin-left: 2em;
}
#contact_info {
	margin-right: 140px;
}
/* END: HEADER STYLES */

/* BEGIN: NAVIGATION STYLES */
nav #quick_links,
nav #download_links {
	font-variant: small-caps;
	line-height: 1.2em;
}

nav #quick_links>a {
	padding-left: .5em;
	padding-right: .5em;
	color: #262626;
}

nav #quick_links>a:hover {
	color: #000099;
}

nav #download_links>a {
	/*border: solid 2px silver;*/
	/*background-color: #262626;*/
	margin-left: 1em;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	color: #262626;
}

nav #download_links>a:hover {
	/*border: solid 2px #262626;*/
	/*background-color: silver;*/
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	color: #000099;
	-webkit-transition: all 1s;
}
/* END: NAVIGATION STYLES */

/* BEGIN: ARTICLE STYLES */
section {
	/*margin-top: 4em;*/
	clear: both;
}

section>h2 {
	border-bottom: solid 5px;
	border-top: solid 1px;
	border-left: solid 1px;
	border-right: solid 1px;
	-webkit-border-radius: 10px 10px 0px 0px;
	-moz-border-radius: 10px 10px 0px 0px;
	border-radius: 10px 10px 0px 0px;
	padding-left: .5em;
	background-color: whitesmoke;
	text-shadow: 1px 1px 1px silver;
	font-variant: small-caps;
}
section>article {
	margin: 1em auto;
}
section>article>header>h3 {
	height: auto;
	width: auto;
	margin: auto;
}

section>article>header>h3,
section>article>header>address,
section>article>header>h4 {
	margin: 0.2em;
}
section>article>header>h3 {
    margin-top: 3em;
    text-decoration: underline;
}

#Skills li {
	line-height: 1.8em;
	margin-left: 1em;
	list-style-position: inside;
}
#Skills ul.skills {
	-webkit-column-count: 4;
	-moz-column-count: 4;
	-o-column-count: 4;
	column-count: 4;
	-webkit-column-width: 20em;
	-moz-column-width: 20em;
	-o-column-width: 20em;
	column-width: 20em;
	-webkit-column-gap: 3em;
	-moz-column-gap: 3em;
	-o-column-gap: 3em;
	column-gap: 3em;
	-webkit-column-rule: dotted thin silver;
	-moz-column-rule: dotted thin silver;
	-o-column-rule: dotted thin silver;
	column-rule: dotted thin silver;
}
#Skills .legend {
	background-color: whitesmoke;
	padding: .5em;
	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
	border-radius: 1em;
}
#Skills .legend ul, #Skills .legend ul li {
	list-style-position: inside;
	line-height: 1em;
}
#Skills .legend {}
#Skills .expert { list-style-type: circle; }
#Skills .proficient { list-style-type: disc; }
#Skills .experienced { list-style-type: square; }
#Skills .no-style {list-style-type: none; }

/* END: ARTICLE STYLES */

/* BEGIN: FOOTER STYLES */
footer a {
	color: #262626;
	text-decoration: none;
}
#signature {
	float: right;
	margin-top: 2em;
	font-family: 'Reenie Beanie', cursive;
	font-size: 2em;
}
/* END: FOOTER STYLES */

.warning {
	font-weight: bold;
	color: red;
}

#gallery button.back {
	width: 6em;
	height: 2em;
	background-color: transparent;
	-webkit-border-radius: .5em;
	-moz-border-radius: .5em;
	border-radius: .5em;
	margin: .5em;
	color: white;
}
/* BEGIN: jQuery lightBox plugin Gallery style */
#gallery {
	background-color: #444;
	padding: 10px;
	width: auto;
	-webkit-border-radius: .5em;
	-moz-border-radius: .5em;
	border-radius: .5em;
}
#gallery ul { list-style: none; }
#gallery ul li { display: inline; }
#gallery ul img {
	border: 5px solid #3e3e3e;
	border-width: 5px 5px 20px;
}
#gallery ul a:hover img {
	border: 5px solid #fff;
	border-width: 5px 5px 20px;
	color: #fff;
}
#gallery ul a:hover { color: #fff; }
/* END: jQuery lightBox plugin Gallery style */