/*--------------------------------------------------------------------------
   

	Typebig Resume / CV

	0. YUI Library is used for CSS reset (http://yuilibrary.com/yui/docs/cssreset/)
	1. Body
	2. Typography
	3. Page Sections
		3.1. Topbar
		3.2. Intro
		3.3. Resume
		3.4. Works
			3.4.1 jQuery Reveal Plugin
		3.5. Contact / References / Testimonials
		3.6. Footer


--------------------------------------------------------------------------*/

/*--------------------------------------------------------------------------
	1. Body
--------------------------------------------------------------------------*/

body {
	color: #OOOOOO;
	background: #fff;
	font: 14px/22px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
	-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
	-webkit-text-size-adjust: 100%;
}




/*--------------------------------------------------------------------------
	2. Typography
--------------------------------------------------------------------------*/

/* Headings Default */
h1 { font-size: 17px; line-height: 20px; font-weight: bold; }
h2 { font-size: 18px; line-height: 27px; }
h3 { font-size: 14px; line-height: 22px; }
h4 { font-size: 13px; line-height: 23px; }
h6 { font-size: 12px; line-height: 14px; }

/* Links */
a, a:visited { color: #OOOOOO; text-decoration: none; underline; outline: 0; }
a:hover, a:focus { color: #000; }
p a, p a:visited { line-height: inherit; }


/* Highlighted Text */
::selection { 
	background: #44bbaa; 
	color:#fff; 
	text-shadow: none; 
}

/* Firefox */
::-moz-selection { 
	background: #44bbaa; 
	color:#fff; 
	text-shadow: none; 
}

em, .italic { font-style: italic; }
strong { font-weight: bold; }
small { font-size: 80%; }

.font-color-primary {
	color: #44bbaa;
}

.font-color-gray {
	color: #bbb;
}

.font-color-black {
	color: #111;
}




/*--------------------------------------------------------------------------
	3. Page Sections
--------------------------------------------------------------------------*/

/* Common Elements */
img {
	max-width: 100%;
}

h3 {
	font: normal 300 12px/22px 'Open Sans', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-bottom: 20px; 
}

h5 { 
	font: normal 11px/21px 'Open Sans', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-bottom: 3px;
}




	/*---------------------------------------------------
		3.1 Topbar

		* This is the fixed top navigation
	---------------------------------------------------*/

	/* Topbar (fixed) */
	/* Please refer to responsive_custom.css for CSS in smaller viewport */
	#section-topbar {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 10000;
		overflow: visible;
		font: normal 16px/24px  'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
	}

	#section-topbar a {
	  color: #fff;
	}

	#topbar-inner {
		background: #111;
		line-height: 0;
		text-align: center;
	}

	/*
		Top Bar

		By default, top navigation bar uses "fixed" position
	*/
	#section-topbar ul#nav {
		display: inline-block;
		position: relative;
		margin: 0;
		padding: 0;

		border-right: 1px solid #222;

		/* For IE, the outcast */
		zoom:1;
		*display: inline;
	}

	#section-topbar ul#nav > li {
		display: block;
        float: left;
        padding: 0;
	}


	#section-topbar ul#nav a {
	  display: block;
	  font: normal 11px/18px "Helvetica Neue", Helvetica, Arial, sans-serif;
	  text-decoration: none;
	  padding: 18px 20px 18px 20px;
	  border-left: 1px solid #222;
	}

		#section-topbar ul#nav a:hover {
		  background: #111;
		  text-decoration: none;
		  border-left: 1px solid #222;
		}

		#section-topbar ul#nav .active a {
			background: #111;
			border-left: 1px solid #222;
		}

			#section-topbar ul#nav .active a:hover {
				background: #111;
			}


		/* jQuery UI tooltip for menu items */
		.ui-tooltip {
			color: #eee;
			background: #222;
			padding: 10px 15px;
			font: normal 300 12px/22px 'Open Sans', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
			text-transform: uppercase;
			letter-spacing: 2px;
			position: absolute;
			z-index: 9999;
			max-width: 300px;
		}

		body .ui-tooltip {
			border: none;
		}




		/*---------------------------------------------------
		3.2 Header

		Includes full-width background iamge and intro paragraph
	---------------------------------------------------*/

	#section-intro {
	}

		/* Profile Image (Full background) */
		#section-profileImage  {
			background: #333 url('../images/profile_main.jpg') no-repeat center center;
			background-size: cover;
			height: 400px;
		}


		#section-profileImage2  {
			background: #333 url('../images/profile_main2.jpg') no-repeat center center;
			background-size: cover;
			height: 400px;
		}
		
		
		#section-profileImage3  {
			background: #333 url('../images/profile_main3.jpg') no-repeat center center;
			background-size: cover;
			height: 400px;
		}

		
			#section-profileImage #box-name {
				color: #333;
				font-size: 16px;
				line-height: 26px;
				margin-top: 0px;
				text-align: center;
			}


			#section-profileImage2 #box-name {
				color: #333;
				font-size: 16px;
				line-height: 26px;
				margin-top: 0px;
				text-align: center;
			}

			#section-profileImage3 #box-name {
				color: #333;
				font-size: 16px;
				line-height: 26px;
				margin-top: 0px;
				text-align: center;
			}



			#section-profileImage2 #box-name h2 {
					color: #ffffff;
					font: normal bold 36px/46px 'Open Sans', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
					letter-spacing: 3px;
					text-transform: uppercase;
				}

            #section-profileImage3 #box-name h2 {
					color: #ffffff;
					font: normal bold 36px/46px 'Open Sans', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
					letter-spacing: 3px;
					text-transform: uppercase;
				}


				#section-profileImage #box-name h2 {
					color: #ffffff;
					font: normal bold 36px/46px 'Open Sans', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
					letter-spacing: 3px;
					text-transform: uppercase;
				}


				#section-profileImage #box-name p {
					color: #ffffff;
					font: normal 300 14px/24px 'Open Sans', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
					margin-top: 10px;
				}

				#section-profileImage #box-name a {
					color: #ffffff;
				}

					#section-profileImage #box-name a:hover {
						color: #ffffff;
					}

				#section-profileImage2 #box-name p {
					color: #ffffff;
					font: normal 300 14px/24px 'Open Sans', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
					margin-top: 10px;
				}

				#section-profileImage2 #box-name a {
					color: #ffffff;
				}

					#section-profileImage2 #box-name a:hover {
						color: #ffffff;
					}


				#section-profileImage3 #box-name p {
					color: #ffffff;
					font: normal 300 14px/24px 'Open Sans', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
					margin-top: 10px;
				}

				#section-profileImage3 #box-name a {
					color: #ffffff;
				}

					#section-profileImage3 #box-name a:hover {
						color: #ffffff;
					}

	
	/*---------------------------------------------------
		3.6 Footer
	---------------------------------------------------*/

	#section-footer {
		color: #777;
		background: #111;
		font: normal 13px/23px 'Open Sans', "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
	}

		#section-footer p {
			margin-top: 32px;
		}

		#section-footer a { color: #fff; }

		#section-footer a:hover { color: #44bbaa; }


		#section-footer ul#social {
			float: right;
			border-left: 1px solid #111;
		}

		#section-footer ul#social li {
			display: inline-block;
			float: left;
		}

		#section-footer ul#social li a {
			display: block;
			line-height: 0;
			padding: 30px;
		}

		@media only screen and (max-width: 767px) {
			#section-footer ul#social li a {
				background: #44bbaa;
			}
		}

		#section-footer ul#social li a:hover {
			background: #44bbaa;
		}