@charset 'UTF-8';
@import url("font-awesome.min.css");
@import url("http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,900,300italic");

@font-face {
    font-family: 'la_chatte_a_mamanregular';
    src: url('../fonts/la_chatte_a_maman-webfont.eot');
    src: url('../fonts/la_chatte_a_maman-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/la_chatte_a_maman-webfont.woff2') format('woff2'),
         url('../fonts/la_chatte_a_maman-webfont.woff') format('woff'),
         url('../fonts/la_chatte_a_maman-webfont.ttf') format('truetype'),
         url('../fonts/la_chatte_a_maman-webfont.svg#la_chatte_a_mamanregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'basic_title_fontregular';
    src: url('../fonts/basictitlefont-webfont.eot');
    src: url('../fonts/basictitlefont-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/basictitlefont-webfont.woff2') format('woff2'),
         url('../fonts/basictitlefont-webfont.woff') format('woff'),
         url('../fonts/basictitlefont-webfont.ttf') format('truetype'),
         url('../fonts/basictitlefont-webfont.svg#basic_title_fontregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'bikoregular';
    src: url('../fonts/biko_regular-webfont.eot');
    src: url('../fonts/biko_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/biko_regular-webfont.woff2') format('woff2'),
         url('../fonts/biko_regular-webfont.woff') format('woff'),
         url('../fonts/biko_regular-webfont.ttf') format('truetype'),
         url('../fonts/biko_regular-webfont.svg#bikoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'oswaldbook';
    src: url('../fonts/oswald-regular-webfont.eot');
    src: url('../fonts/oswald-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/oswald-regular-webfont.woff2') format('woff2'),
         url('../fonts/oswald-regular-webfont.woff') format('woff'),
         url('../fonts/oswald-regular-webfont.ttf') format('truetype'),
         url('../fonts/oswald-regular-webfont.svg#oswaldbook') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'oswaldlight';
    src: url('../fonts/oswald-light-webfont.eot');
    src: url('../fonts/oswald-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/oswald-light-webfont.woff2') format('woff2'),
         url('../fonts/oswald-light-webfont.woff') format('woff'),
         url('../fonts/oswald-light-webfont.ttf') format('truetype'),
         url('../fonts/oswald-light-webfont.svg#oswaldlight') format('svg');
    font-weight: normal;
    font-style: normal;

}


/*********************************************************************************/
/* Loader                                                                        */
/*********************************************************************************/


	.pace {
	  -webkit-pointer-events: none;
	  pointer-events: none;

	  -webkit-user-select: none;
	  -moz-user-select: none;
	  user-select: none;

	  -webkit-perspective: 12rem;
	  -moz-perspective: 12rem;
	  -ms-perspective: 12rem;
	  -o-perspective: 12rem;
	  perspective: 12rem;

	  z-index: 2000;
	  position: fixed;
	  height: 6rem;
	  width: 6rem;
	  margin: auto;
	  top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	}

	.pace.pace-inactive .pace-progress {
	  display: none;
	}

	.pace .pace-progress {
	  position: fixed;
	  z-index: 2000;
	  display: block;
	  position: absolute;
	  left: 0;
	  top: 0;
	  height: 6rem;
	  width: 6rem !important;
	  line-height: 6rem;
	  font-size: 2rem;
	  border-radius: 50%;
	  background: rgba(218, 81, 81, 0.8);
	  color: #fff;
	  font-family: "Helvetica Neue", sans-serif;
	  font-weight: 100;
	  text-align: center;

	  -webkit-animation: pace-theme-center-circle-spin linear infinite 2s;
	  -moz-animation: pace-theme-center-circle-spin linear infinite 2s;
	  -ms-animation: pace-theme-center-circle-spin linear infinite 2s;
	  -o-animation: pace-theme-center-circle-spin linear infinite 2s;
	  animation: pace-theme-center-circle-spin linear infinite 2s;

	  -webkit-transform-style: preserve-3d;
	  -moz-transform-style: preserve-3d;
	  -ms-transform-style: preserve-3d;
	  -o-transform-style: preserve-3d;
	  transform-style: preserve-3d;
	}

	.pace .pace-progress:after {
	  content: attr(data-progress-text);
	  display: block;
	}

	@-webkit-keyframes pace-theme-center-circle-spin {
	  from { -webkit-transform: rotateY(0deg) }
	  to { -webkit-transform: rotateY(360deg) }
	}

	@-moz-keyframes pace-theme-center-circle-spin {
	  from { -moz-transform: rotateY(0deg) }
	  to { -moz-transform: rotateY(360deg) }
	}

	@-ms-keyframes pace-theme-center-circle-spin {
	  from { -ms-transform: rotateY(0deg) }
	  to { -ms-transform: rotateY(360deg) }
	}

	@-o-keyframes pace-theme-center-circle-spin {
	  from { -o-transform: rotateY(0deg) }
	  to { -o-transform: rotateY(360deg) }
	}

	@keyframes pace-theme-center-circle-spin {
	  from { transform: rotateY(0deg) }
	  to { transform: rotateY(360deg) }
	}

/*********************************************************************************/
/* Selection color                                                               */
/*********************************************************************************/


::-moz-selection {
    color: #FF8800;
    background: none;
}

::selection {
    color: #FF8800; 
    background: none;
}

/*********************************************************************************/
/* Basic                                                                         */
/*********************************************************************************/

	body
	{
		background: #252122;
		background-image: url('images/bg02.png');
	}

		body.is-loading * {
			-moz-transition: none !important;
			-webkit-transition: none !important;
			-o-transition: none !important;
			-ms-transition: none !important;
			transition: none !important;
			-moz-animation: none !important;
			-webkit-animation: none !important;
			-o-animation: none !important;
			-ms-animation: none !important;
			animation: none !important;
		}

	body,input,textarea,select
	{
		font-family: 'Source Sans Pro';
		font-weight: 300;
		color: #5d5d5d;
	}

	strong, b
	{
		font-weight: 400;
	}

	i, em
	{
		font-style: italic;
	}

	sub
	{
		position: relative;
		top: 0.5em;
		font-size: 0.8em;
	}
	
	sup
	{
		position: relative;
		top: -0.5em;
		font-size: 0.8em;
	}

	blockquote
	{
		border-left: solid 0.75em #dddddd;
		padding: 1em 0 1em 1.5em;
		font-style: italic;
	}

	h1, h2, h3, h4, h5, h6
	{
		color: #252122;
		font-weight: 700;
	}

		h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
		{
			color: inherit;
			text-decoration: none;
		}

	a
	{
		color: #d52349;
		text-decoration: underline;
	}
	
		a:hover
		{
			text-decoration: none;
		}

	br.clear
	{
		clear: both;
	}

	hr
	{
		border: 0;
		border-top: solid 1px #dddddd;
		height: 1px;
		margin: 2em 0 2em 0;
	}
		
	p, ul, ol, dl, table
	{
		margin-bottom: 2em;
	}

	.clear
	{
		clear: both;
	}

	.divider
	{
		height: 6em;
		background-image: url('../images/shattered.png');
		width: 100%;
	}

	/* Form */
	
		form
		{
		}
		
			form label
			{
				display: block;
				color: #252122;
				font-weight: 400;
				margin: 0 0 0.5em 0;
			}
	
			form input[type=text],
			form input[type=email],
			form input[type=password],
			form select,
			form textarea
			{
				-webkit-appearance: none;
				display: block;
				border: 0;
				padding: 0.75em 1em;
				font-size: 1em;
				border-radius: 5px;
				border: solid 1px #dddddd;
				background: #fff;
				width: 100%;
				color: #8c8a8a;
				outline: 0;
			}

			form input[type=text]:focus,
			form input[type=email]:focus,
			form input[type=password]:focus,
			form select:focus,
			form textarea:focus
			{
				box-shadow: inset 0px 0px 1px 1px #43bff0;
			}

			form textarea
			{
				height: 9em;
				color: #8c8a8a;
			}
			
			form .formerize-placeholder
			{
				color: #555 !important;
			}

			form ::-webkit-input-placeholder
			{
				color: #555 !important;
			}

			form :-moz-placeholder
			{
				color: #555 !important;
			}

			form ::-moz-placeholder
			{
				color: #555 !important;
			}

			form :-ms-input-placeholder
			{
				color: #555 !important;
			}

			form ::-moz-focus-inner
			{
				border: 0;
			}

	/* Tables */
	
		table
		{
			width: 100%;
		}
		
			table.default
			{
				width: 100%;
			}

				table.default tr
				{
					border-top: solid 1px #dddddd;
				}

					table.default tr:first-child
					{
						border-top: 0;
					}
			
				table.default td
				{
					padding: 0.5em 1em 0.5em 1em;
				}
				
				table.default th
				{
					text-align: left;
					padding: 0.5em 1em 0.5em 1em;
					font-weight: 700;
					margin: 0 0 1em 0;
				}
			
				table.default thead
				{
					border-bottom: solid 2px #dddddd;
				}
				
				table.default tfoot
				{
				}
				
				table.default tbody
				{
				}

	/* Section/Article */
	
		section,
		article
		{
			margin-bottom: 2.5em;
		}
		
			section > :last-child,
			article > :last-child
			{
				margin-bottom: 0;
			}

			section:last-child,
			article:last-child
			{
				margin-bottom: 0;
			}

		header
		{
		}

			header > p
			{
				display: block;
				font-style: italic;
			}

			header.major
			{
				position: relative;
				text-align: center;
				top: 1em;
			}

				header.major h2
				{
					background: #fff;
					position: relative;
					top: -0.65em;
					display: inline;
					margin: 0;
					padding: 0 1em 0 1em;
				}

			#header a#logo {
				color: #da5151;
				font-family: 'la_chatte_a_mamanregular';
				font-size: 2.5em;
				font-weight: normal;
				padding-right: 20px;
			}

	/* Box */

		.box
		{

		}

			#competences .box
			{
				background-color: #f7f7f7;
				border-bottom: 2px solid #e2e2e2;
				border-radius: 5px;
			}
			
			.box .image.featured
			{
				position: relative;
				width: auto;
			}

			.box .image.featured:hover
			{
			}

	/* Button */
		
		input[type="button"],
		input[type="submit"],
		input[type="reset"],
		.button
		{
			-webkit-appearance: none;
			display: inline-block;
			text-decoration: none;
			cursor: pointer;
			border: 0;
			border-radius: 5px;
			background: #da5151;
			color: #fff !important;
			outline: 0;
			border-bottom: 2px solid #c03c3c;
		}

			input[type="button"]:hover,
			input[type="submit"]:hover,
			input[type="reset"]:hover,
			.button:hover
			{
			}
			
			input[type="button"]:active,
			input[type="submit"]:active,
			input[type="reset"]:active,
			.button:active
			{
				background: #c51349;
			}
		
			input[type="button"].alt,
			input[type="submit"].alt,
			input[type="reset"].alt,
			.button.alt
			{
				background: #252122;
			}

				input[type="button"].alt:hover,
				input[type="submit"].alt:hover,
				input[type="reset"].alt:hover,
				.button.alt:hover
				{
					background: #353132;
				}
				
				input[type="button"].alt:active,
				input[type="submit"].alt:active,
				input[type="reset"].alt:active,
				.button.alt:active
				{
					background: #151112;
				}
		
			.button.icon
			{
			}
			
				.button.icon:before
				{
					opacity: 0.35;
					position: relative;
					top: 0.05em;
					margin-right: 0.75em;
				}

	/* Image */

		.image
		{
			display: inline-block;
			outline: 0;
		}
		
			.image img
			{
				display: block;
				width: 65%;
				margin-left: 17%;
				border-radius: 5px;
			}

			#portfolio .image img
			{
			}
			
			.image.centered
			{
				display: block;
				margin: 0 0 2em 0;
			}

				.image.centered img
				{
					margin: 0 auto;
					width: auto;
				}

			.image.featured
			{
				display: block;
				width: 100%;
				margin: 0 0 2em 0;
			}
			
			.image.left
			{
				float: left;
				margin: 0 2em 2em 0;
			}

	/* List */

		ul
		{
		}

			ul.default
			{
				list-style: disc;
				padding-left: 1em;
			}
			
				ul.default li
				{
					padding-left: 0.5em;
				}
				
			ul.contact
			{
			}

				ul.contact li
				{
					position: relative;
					border-top: solid 1px #ddd;
					padding: 1.3em 0 1.3em 7em;
				}

					ul.contact li h3
					{
						position: absolute;
						left: 0;
						top: 1.3em;
						font-size: 1.1em;
					}

					ul.contact li p
					{
						margin: 0;
					}
				
				ul.contact li:first-child
				{
					padding-top: 0;
					border-top: 0;
				}

					ul.contact li:first-child h3
					{
						top: 0;
					}
		
			ul.dates
			{
			}
			
				ul.dates li
				{
					position: relative;
					border-top: solid 1px #ddd;
					padding: 1.3em 0 1.3em 6.75em;
				}

				ul.dates .date
				{
					display: block;
					position: absolute;
					left: 0;
					top: 1.3em;
					background-color: #d52349;
					height: 3.5em;
					text-align: center;
					color: #fff;
					line-height: 1em;
					border-top-left-radius: 5px;
					border-bottom-left-radius: 5px;
					padding: 0.5em 0.75em 0 1em;
				}

					ul.dates .date:after
					{
						content: '';
						position: absolute;
						bottom: 0;
						right: -1.2em;
						border-left: solid 1.25em #d52349;
						border-top: solid 1.8em transparent;
						border-bottom: solid 1.8em transparent;
					}
				
					ul.dates .date strong
					{
						display: block;
						font-size: 1.75em;
						padding-top: 0.15em;
					}
					
				ul.dates h3
				{
					font-size: 1.1em;
				}
					
				ul.dates p
				{
					margin: 0;
				}

				ul.dates li:first-child
				{
					border-top: 0;
					padding-top: 0;
				}
				
					ul.dates li:first-child .date
					{
						top: 0;
					}

			ul.divided
			{
			}
			
				ul.divided li
				{
					border-top: solid 1px #ddd;
					padding: 1em 0 1em 0;
				}
				
				ul.divided li:first-child
				{
					border-top: 0;
					padding-top: 0;
				}
			
			ul.social
			{
				overflow: hidden;
				cursor: default;
			}

				ul.social li
				{
					display: inline-block;
				}

				ul.social li:first-child
				{
					margin-left: 0;
				}

				ul.social li a
				{
					display: inline-block;
					width: 3em;
					height: 3em;
					text-align: center;
					border-radius: 5px;
					background: #888;
					-moz-transition: background-color .25s ease-in-out;
					-webkit-transition: background-color .25s ease-in-out;
					-o-transition: background-color .25s ease-in-out;
					-ms-transition: background-color .25s ease-in-out;
					transition: background-color .25s ease-in-out;
				}
				
					ul.social li a:before
					{
						color: #fff;
						font-size: 2em;
						line-height: 1.5em;
					}
				
				ul.social li a.fa-facebook			{ background: #3c5a98; }
				ul.social li a.fa-facebook:hover	{ background: #4c6aa8; }
				ul.social li a.fa-twitter			{ background: #2daae4; }
				ul.social li a.fa-twitter:hover		{ background: #3dbaf4; }
				ul.social li a.fa-dribbble			{ background: #c4376b; }
				ul.social li a.fa-dribbble:hover	{ background: #d4477b; }
				ul.social li a.fa-linkedin			{ background: #006599; }
				ul.social li a.fa-linkedin:hover	{ background: #1075a9; }
				ul.social li a.fa-tumblr			{ background: #2b4661; }
				ul.social li a.fa-tumblr:hover		{ background: #3b5671; }
				ul.social li a.fa-google-plus		{ background: #da2713; }
				ul.social li a.fa-google-plus:hover	{ background: #ea3723; }

		ol
		{
		}	

			ol.default
			{
				list-style: decimal;
				padding-left: 1.25em;
			}

				ol.default li
				{
					padding-left: 0.25em;
				}

/*********************************************************************************/
/* Icons                                                                         */
/*********************************************************************************/

	.icon {
		position: relative;
		text-decoration: none;
	}

		.icon:before {
			-moz-osx-font-smoothing: grayscale;
			-webkit-font-smoothing: antialiased;
			font-family: FontAwesome;
			font-style: normal;
			font-weight: normal;
			text-transform: none !important;
		}

		.icon > .label {
			display: none;
		}

		.icon.featured
		{
			position: relative;
			display: inline-block;
			background-color: #d52349;
			width: 9em;
			padding: 1.75em 0 0.75em 0;
			border-top-left-radius: 5px;
			border-top-right-radius: 5px;
			margin: 0 0 4.5em 0;
			cursor: default;
		}

			.icon.featured:before
			{
				font-size: 4.5em;
				line-height: 1em;
				color: #fff;
			}
					
			.icon.featured:after
			{
				content: '';
				position: absolute;
				bottom: -1.95em;
				left: 0;
				border-top: solid 2em #d52349;
				border-left: solid 4.5em transparent;
				border-right: solid 4.5em transparent;
			}

			.icon.featured.alt
			{
				background-color: #252122;
			}
			
				.icon.featured.alt:after
				{
					border-top-color: #252122;
				}

			.icon.featured.alt2
			{
				background-color: #827a7c;
			}
			
				.icon.featured.alt2:after
				{
					border-top-color: #827a7c;
				}

/*********************************************************************************/
/* Hover                                                                         */
/*********************************************************************************/


.shrink {
  display: inline-block;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.shrink:hover, .shrink:focus, .shrink:active {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
}

.float-shadow {
  display: inline-block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.float-shadow:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  /* W3C */
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  transition-property: transform, opacity;
}
.float-shadow:hover, .float-shadow:focus, .float-shadow:active {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
  /* move the element up by 5px */
}
.float-shadow:hover:before, .float-shadow:focus:before, .float-shadow:active:before {
  opacity: 1;
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
  /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */
}

/*********************************************************************************/
/* Banner                                                                        */
/*********************************************************************************/

	#banner
	{
		background: #f7f7f7 url('../images/pic01.jpg');
		background-position: center center;
		background-size: 100%;
		background-repeat: no-repeat;
		text-align: center;
	}

		#banner strong
		{
			color: #da5151;
			text-shadow: none;
			font-weight: 900;
			font-size: 2em;
			font-family: 'oswaldbook';
		}

		#banner header
		{
		}
		
			#banner header h2
			{
				color: #fff;
				font-weight: 300;
				line-height: normal;
				text-shadow: 2px 2px 0.6em #444;
				font-weight: 400;
			}
			
			#banner header p
			{
				color: #d52349;
				padding: 0;
				font-style: normal;
				margin: 0;
			}

	
		

/*********************************************************************************/
/* Wrappers                                                                      */
/*********************************************************************************/

	#header-wrapper
	{
		position: relative;
		background: #ffffff;
		border-bottom: solid 1px #ccc;
	}

	#main-wrapper
	{
		position: relative;
		background: #f7f7f7;
	}

		#main-wrapper:before
		{
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			background-size: 100% 100%;
			z-index: 0;
			opacity: 0.1;
		}
		
		#main-wrapper .major
		{
		}
		
			#main-wrapper .major h2
			{
				background: #f7f7f7;
			}
	
	#footer-wrapper
	{
		position: relative;
		color: #858484;
		background: url('../images/shattered.png');
	}

		#footer-wrapper:before
		{
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			background-size: 100% 100%;
			z-index: 0;
			opacity: 0.5;
		}
	
		#footer-wrapper a
		{
			color: white;
		}
		
		#footer-wrapper h2,
		#footer-wrapper h3,
		#footer-wrapper h4,
		#footer-wrapper h5,
		#footer-wrapper h6,
		#footer-wrapper strong,
		#footer-wrapper b
		{
			color: #fff;
		}

		#footer-wrapper h1 a, 
		#footer-wrapper h2 a, 
		#footer-wrapper h3 a, 
		#footer-wrapper h4 a, 
		#footer-wrapper h5 a, 
		#footer-wrapper h6 a
		{
			color: inherit;
		}

		#footer-wrapper ul.contact li
		{
			border-top-color: #353434;
			border-top-color: rgba(255,255,255,0.05);
		}

		#footer-wrapper ul.dates li
		{
			border-top-color: #353434;
			border-top-color: rgba(255,255,255,0.05);
		}

		#footer-wrapper ul.divided li
		{
			border-top-color: #353434;
			border-top-color: rgba(255,255,255,0.05);
		}
		
/*********************************************************************************/
/* Parcours                                                                      */
/*********************************************************************************/

	#intro
	{
		text-align: center;
	}

		#intro h2
		{
			font-family: 'basic_title_fontregular';
			font-size: 2.5em;
			font-weight: normal;
			color: #858484;
		}

		.liste_parcours
		{
			margin-bottom: 2em;
			background-color: #f7f7f7;
			border-bottom: 2px solid #e2e2e2;
			border-radius: 5px;
		}

			.liste_parcours h3 
			{
				color: white;
				font-size: 3em;
				font-family: 'bikoregular';
				font-weight: normal;
			}

			span.texte_parcours 
			{
				display: block;
				text-align: left;
				padding-top: 0.5em;
				padding-right: 1em;
			}

		.date_parcours
		{
			font-family: 'bikoregular';
			float: left;
			width: 148px;
			height: 170px;
			margin-right: 1em;
			border-radius: 5px 0 0 5px;
			padding-top: 10px;
		}

			.date_diplome 
			{
				background:url('../images/triangle-rouge.png');
				background-repeat: no-repeat;
			}

			.date_stage 
			{
				background:url('../images/triangle-gris.png');
				background-repeat: no-repeat;
			}

			.date_emploi
			{
				background:url('../images/triangle-noir.png');
				background-repeat: no-repeat;
			}

			.date_parcours span 
			{
				color: white;
				font-size: 0.8em;
				font-family: 'oswaldlight';
				font-weight: normal;
				margin-left: 20px;
				margin-bottom: 10px;
				display: block;
				text-align: left;
				margin-bottom: -25px;
			}

			.date_parcours span.annee
			{
				font-size: 2em;
				font-family: 'oswaldbook';
			}

		.nom_parcours 
		{
			font-family: 'basic_title_fontregular';
			font-size: 1.5em;
			color: #da5151;
			display: block;
			text-align: left;
			padding-top: 0.7em;
		}

			.nom_diplome
			{
				color: #da5151;
			}

			.nom_stage 
			{
				color: #808080;
			}

			.nom_emploi
			{
				color: #404040;
			}

		.lieu_parcours 
		{
			color: #808080;
			font-family: 'bikoregular';
			display: block;
			text-align: left;
			font-size: 0.8em;
			padding-top: 0.5em;
		}

/*********************************************************************************/
/* Competences                                                                   */
/*********************************************************************************/

	#competences
	{
		text-align: center;
		padding-top: 6em;
	}

		#competences .row header
		{
			margin-bottom: 0.5em;
		}

		#competences h2
		{
			font-family: 'basic_title_fontregular';
			font-size: 2.5em;
			font-weight: normal;
			color: #858484;
		}

		#competences h3
		{
			font-family: 'basic_title_fontregular';
			font-size: 1.5em;
			text-transform: uppercase;
			font-weight: bold;
			color: #da5151;
		}

		#competences img
		{
			width: 60%;
			margin-bottom: 2em;
		}

/* *******************************************************************************/
/* Extras                                                                        */
/*********************************************************************************/

#extras
{
	text-align: center;
	padding-top: 6em;
}

	#extras h2
	{
		font-family: 'basic_title_fontregular';
		font-size: 2.5em;
		font-weight: normal;
		color: #858484;
	}

	#extras .liste_parcours
		{
			padding: 1em;
		}

		#extras .nom_diplome 
		{
			font-family: 'basic_title_fontregular';
			font-size: 1.5em;
			color: #da5151;
			display: block;
			text-align: left;
		}
		
		span.texte_parcours 
		{
			display: block;
			text-align: left;
		}

		#extras .nom_parcours
		{
			padding-top: 0;
		}

		#extras img 
		{
			float: left;
			width: 100px;
			margin-right: 2em;
		}

		#cv
		{
			margin-bottom: 4em;
			margin-left: auto;
			margin-right: auto;
			background-image: url('../images/shattered.png');
			background-size: 50%;
			border-radius: 10px;
			padding: 1em;
			width: 55%;
		}
			#cv .shrink
			{
				background-color: white;
				border-bottom: 2px solid #bbb;
				margin-top: 0.5em;
			}
		
			#cv h2
			{
				font-size: 1.3em;
			}

			#cv span
			{
				color: #858484;
				text-transform: uppercase;
				margin-left: 0.5em;
			}

			#cv img 
			{
				float: none;
				width: 0.7em;
				margin-right: 0;
			}


/* *******************************************************************************/
/* Portfolio                                                                     */
/*********************************************************************************/

#portfolio
{
	padding-top: 6em;
}

	#portfolio h2
	{
		font-family: 'basic_title_fontregular';
		font-size: 2.5em;
		font-weight: normal;
		color: #858484;
	}	

	#portfolio h3 {
		font-family: 'basic_title_fontregular';
		text-align: center;
		color: #8c8a8a;
	}

	p.portfolio
	{
		height: 3em;
		text-align: center;
	}

	#portfolio a.image:hover
	{
		
	}

	#portfolio .divider
	{
		display: none;
	}

	.grayscale img
	{
		opacity: 0.8;
		border-radius: 100%;
		filter: grayscale(1);
		-webkit-filter: grayscale(1);
		-moz-filter: grayscale(1);
		-o-filter: grayscale(1);
		-ms-filter: grayscale(1);
		-webkit-transition: 0.8s; /* For Safari 3.1 to 6.0 */
    	transition: 0.8s;
	}

	.grayscale img:hover
	{
		opacity: 1;
		border-radius: 5px;
		filter: grayscale(0);
		-webkit-filter: grayscale(0);
		-moz-filter: grayscale(0);
		-o-filter: grayscale(0);
		-ms-filter: grayscale(0);
		-webkit-transition: 0.5s; /* For Safari 3.1 to 6.0 */
    	transition: 0.5s;
	}



/*********************************************************************************/
/* Footer + formulaire de contact                                                */
/*********************************************************************************/

form label
{
	color: #8c8a8a;
	font-weight: 100;
	margin: 1em 0 0.5em 0;
}

input[type=submit]
{
	margin: 2em 0;
	float: right;
}

#footer 
{
	padding-top: 6em;
}

	#footer h2 
	{
		background: none;
		color: #8c8a8a;
		font-family: 'basic_title_fontregular';
		font-size: 2.5em;
		font-weight: normal;
	}

	#infos
	{
		margin-bottom: 2em;
	}

	#photo_me
	{
		background: url('../images/me.png');
		background-size: contain;
		background-repeat: no-repeat;
		width: 100%;
		background-position: center;
		height: 143px;
		margin-bottom: 1em;
	}

		form
		{

		}

			span.send
			{
				background-color: #da5151;
				display: block;
				border-radius: 5px;
				padding: 1em;
				color: white;
			}

			span.error_contact
			{
				display: block;
				border-radius: 5px;
				padding: 0.5em;
				color: #da5151;
				margin-top: 0.5em;
			}

		#infos_nom
		{
			color: #8c8a8a;
			font-family: 'basic_title_fontregular';
			font-size: 1.5em;
			text-align: center;
			margin-bottom: 0.5em;
		}

		#infos_mail
		{
			padding: 1em 0 1em 0;
			color: #8c8a8a;
			text-align: center;
		}

		#infos_localisation
		{
			padding: 1em 0 1em 0;
			text-align: center;
			color: #8c8a8a;
		}

		#infos img 
		{
			width: 32px;
			margin-right: 1em;
			vertical-align: middle;
		}

	img.social
	{
		width: auto;
		margin-left: 1em;
		margin-right: 1em;
	}

	img#photo
	{
		width: 30%;
		float: left;
		margin-right: 1em;
	}

	#social_container
	{
		width: 100%;
		text-align: center;
		margin: 0;
		margin-bottom: 3.3em;
	}

	span.error_contact 
	{
	    font-size: 1em;
	    color: red;
	    position: absolute;
	    margin-top: -103px;
	    margin-left: 60px;
	    padding-bottom: 0;
	}

	span.error_contact.message 
	{
	    font-size: 1em;
	    color: red;
	    position: absolute;
	    margin-top: -203px;
	    margin-left: 130px;
	    padding-bottom: 0;
	}

	span.error_contact.capcha {
	    margin-left: 320px;
	    margin-top: -105px;
	}

	span.send 
	{
	    background-color: #da5151;
	    color: white;
	    border-bottom: 4px solid #c03c3c;
	    font-size:1em;
	    padding:20px;
	    border-radius:3px;
	    margin-bottom: 20px;
	    display: block;
	    text-align:center;
	}

	#img_verif_code {
		display: inline-block;
    	vertical-align: bottom;
	}


/*********************************************************************************/
/* Copyright                                                                     */
/*********************************************************************************/

	#copyright
	{	
		text-align: center;
	}
	
		#copyright .links
		{
			display: inline-block;
			background: #2C2929;
			background: rgba(0,0,0,0.15);
			border-radius: 5px;
			margin: 0;
			width: 100%;
		}


/*********************************************************************************/
/* Details                                                                       */
/*********************************************************************************/

#details
{
}

	.banner-details
	{
		border-radius: 5px;
	}

	.banner-solar 
	{
		background: #ec0f6c url('../images/pic14.png');
		background-repeat: no-repeat;
		background-position: right center;
		height: auto;
		background-size: 30%;
		margin-top: 2em;
	}

	.banner-nouvelle-vie
	{
		background: white url('../images/pic10.png');
		background-repeat: no-repeat;
		background-position: right center;
		height: auto;
		background-size: 30%;
	}

	.banner-liv-lib
	{
		background: white url('../images/pic17.png');
		background-repeat: no-repeat;
		background-position: right center;
		height: auto;
		background-size: 30%;
	}

	.banner-old-portfolio
	{
		background: #181818 url('../images/pic18.png');
		background-repeat: no-repeat;
		background-position: right center;
		height: auto;
		background-size: 30%;
	}

	.banner-sweat-imac
	{
		background: #2c3147 url('../images/pic12.png');
		background-repeat: no-repeat;
		background-position: right center;
		height: auto;
		background-size: 30%;
	}

	.banner-opera
	{
		background: #474747 url('../images/pic11.png');
		background-repeat: no-repeat;
		background-position: right center;
		height: auto;
		background-size: 30%;
	}

	.banner-hipsteric
	{
		background: #271e15 url('../images/pic13.png');
		background-repeat: no-repeat;
		background-position: right center;
		height: auto;
		background-size: 30%;
	}

	.banner-src
	{
		background: #d2d2d2 url('../images/pic16.png');
		background-repeat: no-repeat;
		background-position: right center;
		height: auto;
		background-size: 30%;
	}

	.banner-diabon
	{
		background: #5c89c7 url('../images/pic15.png');
		background-repeat: no-repeat;
		background-position: right center;
		height: auto;
		background-size: 30%;
	}

	#details h2 
	{
		font-family: 'oswaldbook';
		font-size: 3em;
		color: white;
		padding: 1em 0.6em 0 0.6em;
		text-align: left;
		line-height: 1em;
	}

		#details .banner-nouvelle-vie h2
		{
			color: #424041;
		}

		#details .banner-liv-lib h2
		{
			color: #8c8dc5;
		}

		#details .banner-old-portfolio h2
		{
			color: #0073ca;
		}

		#details .banner-src h2
		{
			color: #261f2a;
		}

		#details .banner-diabon h2
		{
			color: white;
		}

	#details .banner-details span 
	{
		font-family: 'oswaldlight';
		font-size: 2em;
		color: white;
		padding: 0.5em 1em 1em 1em;
		text-align: left;
		display: block;
	}

		#details .banner-nouvelle-vie span
		{
			color: #424041;
		}

		#details .banner-liv-lib span
		{
			color: #8c8dc5;
		}

		#details .banner-old-portfolio span
		{
			color: #0073ca;
		}

		#details .banner-src span
		{
			color: #261f2a;
		}

		#details .banner-diabon span
		{
			color: white;
		}

	#hastag-container
	{
		display: block;
		margin-top: -20px;
		margin-bottom: 2em;
	}

	.hashtag
	{
		background: #ccc;
		border-bottom: 2px solid #8c8a8a;
		float: right;
		margin: 0.5em;
		padding: 0.25em 1em;
		border-radius: 3px;
		color: #8c8a8a;
	}

	#details img#multi-ecrans
	{
		width: 100%;
		margin-top: -2em;
		margin-bottom: 4em;
		border-radius: 5px;
	}

	#details-content
	{
		margin-top: 4em;
	}

		.details-title 
		{
			color: #da5151;
			text-shadow: none;
			font-weight: 900;
			font-size: 2em;
			font-family: 'oswaldbook';
			display: block;
			margin-bottom: 1em;
			margin-top: 2em;
		}

		/*
		#details-content img
		{
			border-radius: 5px;
			width: 30%;
			margin-left: auto;
			margin-right: auto;
			display: block;
			margin-top: 1em;
			margin-bottom: 1em;
		}
		*/

		.details-text
		{
			text-align: justify;
			font-size: 1em;
			color: #8c8a8a;
			margin-bottom: 2em;
			width: 60%;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: 0;
			background-color: #eee;
			padding: 1em;
			border-bottom: 2px solid #8c8a8a;
			border-radius: 5px;
		}

			img#logo-final
			{
				border-radius: 5px;
				width: 90%;
				margin-left: auto;
				margin-right: auto;
				display: block;
				margin-top: 2em;
				margin-bottom: 2em;
			}

		#details-content ul
		{
			margin-left: 3em;
			margin-bottom: 0;
		}

			#details-content li 
			{
				list-style: initial;
				text-align: left;
			}

		.videoWrapper
		{
			position: relative;
			padding-bottom: 56.25%; /* 16:9 */
			padding-top: 25px;
			height: 0;
			margin: 1em;
		}

		.videoWrapper iframe
		{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}

	a#btn-retour
	{
		position: fixed;
		top: 5em;
		left: 0;
		margin-left: 2em;
		z-index: 100;
	}

	.back-to-top {
	    position: fixed;
	    bottom: 2em;
	    right: 2em;
	    background: url('../images/arrow_up.png');
	    display: none;
	    width: 60px;
	    height: 60px;
	}

	.back-to-top:hover {    
	    opacity: 0.8;
	}