/*
		=================================
		
			CSS	v1.3.6
		
	 	=================================

	loading general functions ------- OK
	loading database connexion ------ echec
	loading css functions ----------- OK
	loading vars -------------------- OK
	loading lan --------------------- OK (en)
	website name -------------------- one color
	website link -------------------- https://www.one-color.com
	last modified ------------------- 27/Jan/2020 16:51:28
	author -------------------------- Seb @ One Color

	listing available colors -

		#FFFFFF --- blanc
		#FAFAFA --- sblanc
		#F2F2F2 --- llgris
		#C5C5C5 --- lgris
		#909090 --- gris
		#555555 --- sgris
		#202020 --- lnoir
		#000000 --- noir
		#FF8080 --- lrouge
		#FF0000 --- rouge
		#600000 --- srouge
		#80FF80 --- lvert
		#00FF00 --- vert
		#006000 --- svert
		#8080FF --- lbleu
		#0000FF --- bleu
		#000060 --- sbleu
		#FFFFAA --- ljaune
		#FFFF00 --- jaune
		#878700 --- sjaune
		#3b5998 --- facebook
		#55acee --- twitter
		#9b6954 --- instagram
		#dd4b39 --- googleplus
		#bb0000 --- youtube
		#cb2027 --- pinterest
		#007bb5 --- linkedin
		#45bbff --- vimeo
		#fffc00 --- snapchat



	/*=============================================================================*\
	=										=
	=		RESET STYLE / IMPORT FONTS / TRANSITIONS / ANIMATIONS		=
	=										=
	\*=============================================================================*/




h1,h2,h3,h4,h5,h6,p,ul,ol,li,blockquote,pre,html,body,table,tbody,tr,th,td,tfoot,thead,img,form,fieldset,a {
	margin: 0;
	padding: 0;
	border: none;
	outline:none;
}
a{
	color:inherit;
}
html,body{
	height:100%;
	max-height:100%;
	width:100%;
	margin:0;
	padding:0;
	font-family:"OneColor","helvetica light", "Arial", sans-serif;
	overflow-y: auto;
}
*:focus {
	outline: none!important;
}
@font-face {
	font-family: "OneColor";
	src:
		url("../font/helvetica/HelveticaNeue.eot");
	src: 
		url("../font/helvetica/HelveticaNeue.eot?#iefix") format('embedded-opentype'),
		url("../font/helvetica/HelveticaNeue.svg#HelveticaNeue") format('svg'),
		url("../font/helvetica/HelveticaNeue.ttf") format('truetype'),
		url("../font/helvetica/HelveticaNeue.woff") format('woff'),
		url("../font/helvetica/HelveticaNeue.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "OneColorLight";
	src:
		url("../font/helvetica/HelveticaNeue-Light.eot");
	src: 
		url("../font/helvetica/HelveticaNeue-Light.eot?#iefix") format('embedded-opentype'),
		url("../font/helvetica/HelveticaNeue-Light.svg#HelveticaNeue-Light") format('svg'),
		url("../font/helvetica/HelveticaNeue-Light.ttf") format('truetype'),
		url("../font/helvetica/HelveticaNeue-Light.woff") format('woff'),
		url("../font/helvetica/HelveticaNeue-Light.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "OneColorLightItalic";
	src:
		url("../font/helvetica/HelveticaNeue-LightItalic.eot");
	src: 
		url("../font/helvetica/HelveticaNeue-LightItalic.eot?#iefix") format('embedded-opentype'),
		url("../font/helvetica/HelveticaNeue-LightItalic.svg#HelveticaNeue-LightItalic") format('svg'),
		url("../font/helvetica/HelveticaNeue-LightItalic.ttf") format('truetype'),
		url("../font/helvetica/HelveticaNeue-LightItalic.woff") format('woff'),
		url("../font/helvetica/HelveticaNeue-LightItalic.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "OneColorUltraLight";
	src:
		url("../font/helvetica/HelveticaNeue-UltraLight.eot");
	src: 
		url("../font/helvetica/HelveticaNeue-UltraLight.eot?#iefix") format('embedded-opentype'),
		url("../font/helvetica/HelveticaNeue-UltraLight.svg#HelveticaNeue-UltraLight") format('svg'),
		url("../font/helvetica/HelveticaNeue-UltraLight.ttf") format('truetype'),
		url("../font/helvetica/HelveticaNeue-UltraLight.woff") format('woff'),
		url("../font/helvetica/HelveticaNeue-UltraLight.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "OneColorCondensedBold";
	src: 
		url("../font/helvetica/HelveticaNeue-CondensedBold.ttf") format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "OneColorComm";
	src:
		url("../font/bauer-bodoni/BauerBodoniBT-BlackItalic.eot");
	src: 
		url("../font/bauer-bodoni/BauerBodoniBT-BlackItalic.eot?#iefix") format('embedded-opentype'),
		url("../font/bauer-bodoni/BauerBodoniBT-BlackItalic.svg#BauerBodoniBT-BlackItalic") format('svg'),
		url("../font/bauer-bodoni/BauerBodoniBT-BlackItalic.ttf") format('truetype'),
		url("../font/bauer-bodoni/BauerBodoniBT-BlackItalic.woff") format('woff'),
		url("../font/bauer-bodoni/BauerBodoniBT-BlackItalic.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "CreamRecords";
	src:
		url("../font/air-americana/AirAmericana.eot");
	src: 
		url("../font/air-americana/AirAmericana.eot?#iefix") format('embedded-opentype'),
		url("../font/air-americana/AirAmericana.svg#AirAmericana") format('svg'),
		url("../font/air-americana/AirAmericana.ttf") format('truetype'),
		url("../font/air-americana/AirAmericana.woff") format('woff'),
		url("../font/air-americana/AirAmericana.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "HeroesStudio";
	src:
		url("../font/brandon-light/BrandonGrotesque-Light.eot");
	src: 
		url("../font/brandon-light/BrandonGrotesque-Light.eot?#iefix") format('embedded-opentype'),
		url("../font/brandon-light/BrandonGrotesque-Light.svg#BrandonGrotesque-Light") format('svg'),
		url("../font/brandon-light/BrandonGrotesque-Light.ttf") format('truetype'),
		url("../font/brandon-light/BrandonGrotesque-Light.woff") format('woff'),
		url("../font/brandon-light/BrandonGrotesque-Light.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "NightColours";
	src:
		url("../font/corona-3-typewriter/Corona3Typewriter.eot");
	src: 
		url("../font/corona-3-typewriter/Corona3Typewriter.eot?#iefix") format('embedded-opentype'),
		url("../font/corona-3-typewriter/Corona3Typewriter.svg#Corona3Typewriter") format('svg'),
		url("../font/corona-3-typewriter/Corona3Typewriter.ttf") format('truetype'),
		url("../font/corona-3-typewriter/Corona3Typewriter.woff") format('woff'),
		url("../font/corona-3-typewriter/Corona3Typewriter.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "VelvetModels";
	src:
		url("../font/didot/Didot.eot");
	src: 
		url("../font/didot/Didot.eot?#iefix") format('embedded-opentype'),
		url("../font/didot/Didot.svg#Didot") format('svg'),
		url("../font/didot/Didot.ttf") format('truetype'),
		url("../font/didot/Didot.woff") format('woff'),
		url("../font/didot/Didot.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "VelvetModelsBold";
	src:
		url("../font/didot/Didot-Bold.eot");
	src: 
		url("../font/didot/Didot-Bold.eot?#iefix") format('embedded-opentype'),
		url("../font/didot/Didot-Bold.svg#Didot-Bold") format('svg'),
		url("../font/didot/Didot-Bold.ttf") format('truetype'),
		url("../font/didot/Didot-Bold.woff") format('woff'),
		url("../font/didot/Didot-Bold.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: "VelvetModelsItalic";
	src:
		url("../font/didot/Didot-Italic.eot");
	src: 
		url("../font/didot/Didot-Italic.eot?#iefix") format('embedded-opentype'),
		url("../font/didot/Didot-Italic.svg#Didot-Italic") format('svg'),
		url("../font/didot/Didot-Italic.ttf") format('truetype'),
		url("../font/didot/Didot-Italic.woff") format('woff'),
		url("../font/didot/Didot-Italic.woff2") format('woff2');
	font-weight: normal;
	font-style: normal;
}
.transition{
	transition-property: all;
	transition-duration: 0.2s;
	transition-timing-function: ease-in-out;
	transition-delay: 0s;
	animation-iteration-count: infinite;
	-webkit-transition-property: all;
	-webkit-transition-duration: 0.2s;
	-webkit-transition-timing-function: ease-in-out;
	-webkit-transition-delay: 0s;
	-moz-transition-property: all;
	-moz-transition-duration: 0.2s;
	-moz-transition-timing-function: ease-in-out;
	-moz-transition-delay: 0s;
	-o-transition-property: all;
	-o-transition-duration: 0.2s;
	-o-transition-timing-function: ease-in-out;
	-o-transition-delay: 0s;
}
.blinker{
	transition-property: all;
	transition-duration: 0.5s;
	transition-timing-function: ease-in-out;
	transition-delay: 0s;
	animation-iteration-count: infinite;
	-webkit-transition-property: all;
	-webkit-transition-duration: 0.5s;
	-webkit-transition-timing-function: ease-in-out;
	-webkit-transition-delay: 0s;
	-moz-transition-property: all;
	-moz-transition-duration: 0.5s;
	-moz-transition-timing-function: ease-in-out;
	-moz-transition-delay: 0s;
	-o-transition-property: all;
	-o-transition-duration: 0.5s;
	-o-transition-timing-function: ease-in-out;
	-o-transition-delay: 0s;
}
@keyframes blinker {
	50% {
		opacity: 0;
	}
}

:root{
	--scale-captcha: 1;
}


	/*=============================================================================*\
	=										=
	=				COMPUTER DESING					=
	=										=
	\*=============================================================================*/


@media screen and (min-width:800px){

	body{
		margin: 0;
		display:flex;
		color:#FFFFFF;
		background-color:#000000;
		font-size:15px;
	}
	#website{
		height:100%;
		max-height:1000px;
		min-height:500px;
		width:100%;
		max-width:2000px;
		margin: auto;
		display:flex;
		flex-direction: column;
		justify-content: flex-end;
	}
		#header{
			min-height:50px;
			width: auto;
			margin:25px 25px 25px 25px;
			padding-right:10px;
		}
			#header>div{
				display:table;
			}
			#title{
				height:80px;
				width: 100%;
				font-family:"OneColorComm";
				letter-spacing:-3px;
				font-size:80px;
				line-height:80px;
				text-align:right;
			}
			#menu{
				font-size:15px;
				line-height:15px;
				list-style-type:none;
				width:100%;
				display: inline-flex;
				/*justify-content: space-between;*/
				justify-content: flex-end;
			}
				#menu li{
				}
					#menu li a{
						display:block;
						padding:0 8px;
					}
					#menu li:last-child a{
						padding-right:0;
					}
					#menu li:hover a,
					#menu li a:hover,
					#menu li a.selected{
						text-decoration:underline;
					}
		#body_container{
			flex:1;
			display:flex;
			flex-direction: column;
			overflow-y: auto;
			width:100%;
			margin:0 auto;
			position:relative;
		}
			#body{
				flex:1;
				display:flex;
				flex-direction: column;
				max-width:1000px;
				min-width:800px;
				width:100%;
				margin:0 auto;
				position:relative;
			}
				#body>*:not(.slider):not(.table){
					margin: auto;
				}
				#background_intro{
					width:100%;
					max-width:400px;
					height:100%;
					background-repeat:no-repeat;
					background-position:center;
					background-size: contain;
				}
			#footer{
				width:100%;
				height:10px;
				font-size:10px;
				line-height:10px;
				text-align:center;
				overflow-y: hidden;
				padding-bottom:15px;
				margin-top:25px;
			}
				#footer a img{
					vertical-align:middle;
					height:100%;
				}
				#flags{
					position:absolute;
					bottom:15px;
					right:15px;
					height:15px;
				}
					#flags a{
						display:inline-block;
						height:15px;
						width:20px;
						margin:0 5px;
					}
	.message_warning{
		width:75%;
		margin:0 auto;
		text-align:center;
		color:#FFFFFF;
		background-color:rgba(0,0,0,0.80);
		padding:10px;
		-webkit-box-shadow: 0px 0px 5px 3px rgba(255,255,255,1.00);
		-moz-box-shadow: 0px 0px 5px 3px rgba(255,255,255,1.00);
		box-shadow: 0px 0px 5px 3px rgba(255,255,255,1.00);

	}
	.message_texte{
		width:100%;
		margin:0 auto;
		text-align:center;
		text-shadow:
			0 0 1px #000000,
			0 0 2px #000000,
			0 0 4px #000000,
			0 0 6px #000000;
		font-family:"OneColorUltraLight";
		/*background-color:rgb(0,0,0,0.50);*/
	}
		.message_texte span{
			white-space: pre;
		}
		.texte_addon{
			height:450px;
		}
	.message_texte_big{
		text-align:justify;
		font-size:40px;
	}
		.message_texte_big .half{
			font-size:25px;		
		}



	.one_color_work_title{
		width:100%;
		font-size:100px;
		vertical-align:middle;
		text-align:center;
		white-space: nowrap;
		text-align:center;
		letter-spacing:3px;
		margin:10px 0 0 0 !important;
		padding-bottom:23px!important;
		align-self: flex-end;
		position:relative;
		text-transform:uppercase;
	}
	.one_color_work_title:after{
		content: " ";
		position:absolute;
		bottom:15px;
		left:50%;
		border: solid #FFFFFF;
		border-width: 0 3px 3px 0;
		display: block;
		padding: 13px;
		margin-left:-7px;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform: rotate(45deg);

		animation: blinker 1s linear infinite;
	}
	.one_color_work_title:before{	/*	hack pour focer le scolling	*/
		content: ".";
		position:absolute;
		bottom:-30px;
		display: block;
		visibility:hidden;
	}
	.one_color_work_title.hide_arrow:after{
		display:none;
		visibility:hidden;
	}
	#one_color_project{
		width:100%;
	}
		.one_color_project_tr{
			
		}
			.one_color_project_td{
				padding:0;
				margin:10px;
				display:inline-block;
				overflow:hidden;
				vertical-align:top;
				background-size:cover;
				background-position:center center;
				background-repeat:no-repeat;
				-webkit-box-shadow: 3px 4px 6px 3px rgba(0,0,0,0.80);
				-moz-box-shadow: 3px 4px 6px 3px rgba(0,0,0,0.80);
				box-shadow: 3px 4px 6px 3px rgba(0,0,0,0.80);

				position:relative;
			}
				.one_color_project_td_scroll{
					width:100%;
					height:100%;
					position:absolute;
					background-color:rgba(0,0,0,0.90);
					display: flex;
					flex-direction: column;
					justify-content: center;
					top:-200px;
					left:0;
					zoom: 1;
					filter: alpha(opacity=0);
					-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
					-moz-opacity:0;
					-khtml-opacity:0;
					opacity: 0;

				}
				.one_color_project_td:hover .one_color_project_td_scroll{
					top:0px;
					left:0;
					zoom: 1;
					filter: alpha(opacity=100);
					-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
					-moz-opacity:1;
					-khtml-opacity:1;
					opacity: 1;

				}
					.one_color_project_td_scroll div{
						color:#FFFFFF;
						text-align:center;
						padding:10px;
					}
					.one_color_project_td_scroll_marque{
						text-transform:uppercase;
					}
					.one_color_project_td_scroll_marque span{
						letter-spacing:normal!important;
					}
					.one_color_project_td_scroll_description{
						letter-spacing:1px!important;
						flex: 1;
					}
					.one_color_project_td_scroll_famille{
						text-transform:uppercase;
					}
		.project_img{
			width:100%;
			margin:15px 0px;
			-webkit-box-shadow: 3px 4px 6px 3px rgba(0,0,0,0.80);
			-moz-box-shadow: 3px 4px 6px 3px rgba(0,0,0,0.80);
			box-shadow: 3px 4px 6px 3px rgba(0,0,0,0.80);

		}
		.goBack{
			position:absolute;
			right:12px;
			top:58px;
		}
	#one_color_work{
		width:100%;
		display:none;
	}
		.one_color_work_tr{
			display: flex;
			justify-content: flex-start;
		}
			.one_color_work_td{
				width:25%;
				height:240px;
				margin:10px;
				display:flex;
				flex-direction: column;
				overflow:hidden;
				border:1px #000000 solid;
			}
			.one_color_work_td.no_border{
				border:none;
			}
				.one_color_work_td_titre{
					height:25px;
					width:100%;
					font-size:24px;
					line-height:25px;
					white-space: nowrap;
					text-transform: uppercase;
					padding:2px 0;
					text-align:center;
					overflow:hidden;
					text-overflow:"...";
					color:#000000;
				}
				.one_color_work_td_contenu{
					flex: 1;
					position:relative;
					background-color:inherit;
					background-position: center center;
					background-repeat:no-repeat;
					background-size:auto;
				}
					.one_color_work_td_contenu_scroll{
						width: -moz-calc(100% - 20px);
						width: -webkit-calc(100% - 20px);
						width: -o-calc(100% - 20px);
						width: calc(100% - 20px);

						height: -moz-calc(100% - 20px);
						height: -webkit-calc(100% - 20px);
						height: -o-calc(100% - 20px);
						height: calc(100% - 20px);

						position:absolute;
						left:200px;
						zoom: 1;
						filter: alpha(opacity=0);
						-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
						-moz-opacity:0;
						-khtml-opacity:0;
						opacity: 0;

						background-color:inherit;
						overflow-y:auto;
						text-transform:uppercase;
						padding:10px;
						color:#000000;
						font-size:17px;
					}
					.one_color_work_td:hover .one_color_work_td_contenu{
						background-position: -300px center;
					}
					.one_color_work_td:hover .one_color_work_td_contenu_scroll{
						zoom: 1;
						filter: alpha(opacity=100);
						-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
						-moz-opacity:1;
						-khtml-opacity:1;
						opacity: 1;

						left:0;
					}
	.degrade_1{
		background: #00cccc;
		background: -webkit-gradient(linear, left top, left bottom, from(#00cccc), to(#0033cc));
		background: -webkit-linear-gradient(top, #00cccc, #0033cc);
		background: -moz-linear-gradient(top, #00cccc, #0033cc);
		background: -ms-linear-gradient(top, #00cccc, #0033cc);
		background: -o-linear-gradient(top, #00cccc, #0033cc);
		background: linear-gradient(to bottom, #00cccc, #0033cc);
		background: linear-gradient(#00cccc,#0033cc);

	}
	.degrade_2{
		background: #ff99cc;
		background: -webkit-gradient(linear, left top, left bottom, from(#ff99cc), to(#0033cc));
		background: -webkit-linear-gradient(top, #ff99cc, #0033cc);
		background: -moz-linear-gradient(top, #ff99cc, #0033cc);
		background: -ms-linear-gradient(top, #ff99cc, #0033cc);
		background: -o-linear-gradient(top, #ff99cc, #0033cc);
		background: linear-gradient(to bottom, #ff99cc, #0033cc);
		background: linear-gradient(#ff99cc,#0033cc);

	}




}


	/*=============================================================================*\
	=										=
	=				TABLETTE DESIGN					=
	=										=
	\*=============================================================================*/


@media screen and (max-width:799px){

	body{
		margin: 0;
		display:flex;
		color:#FFFFFF;
		background-color:#000000;
		font-size:30px;
	}
	#website{
		height:100%;
		min-height:266px;
		width:100%;
		margin: auto;
		display:flex;
		flex-direction: column;
	}
		#header{
			display:block;
			width: 100%;
			margin-bottom:10px;
		}
			#header>div{
				display:block;
			}
			#title{
				height:120px;
				font-family:"OneColorComm";
				letter-spacing:-3px;
				font-size:120px;
				line-height:120px;
				text-align:center;
				text-overflow:hidden;
				white-space:nowrap;
			}
			#menu{
				font-size:30px;
				line-height:30px;
				list-style-type:none;
				width:100%;
				display: table;
				table-layout:fixed;
				padding:0;
			}
				#menu li{
					display:table-cell;
				}
					#menu li a{
						display:block;
						padding:10px 0;
						white-space:nowrap;
						overflow:hidden;
						text-align:center;
					}
					#menu li:hover a,
					#menu li a:hover,
					#menu li a.selected{
						text-decoration:none;
						background-color:rgba(255,255,255,0.20);
					}
		#body_container{
			flex:1;
			overflow-x:auto;
			position:relative;
		}
			#body{
				width: -moz-calc(100% - 40px);
				width: -webkit-calc(100% - 40px);
				width: -o-calc(100% - 40px);
				width: calc(100% - 40px);

				height:100%;
				flex:1;
				overflow-y: auto;
				padding:0 20px;
			}
				#body>*{
					margin: auto;
				}
				#background_intro{
					width:100%;
					height:100%;
					background-repeat:no-repeat;
					background-position:center;
					background-size: contain;
				}
		#footer{
			width:100%;
			height:20px;
			font-size:20px;
			line-height:20px;
			text-align:center;
			overflow-y: hidden;
			margin-top:10px;
		}
			#footer a img{
				max-height:20px;
				vertical-align:middle
			}
			#flags{
				border-left:2px #FFFFFF solid;
				padding-left:6px;
				display:inline-block;
			}
	.message_warning{
		width:75%;
		margin:0 auto;
		text-align:center;
		color:#FFFFFF;
		background-color:rgba(0,0,0,0.80);
		padding:10px;
		-webkit-box-shadow: 0px 0px 5px 3px rgba(255,255,255,1.00);
		-moz-box-shadow: 0px 0px 5px 3px rgba(255,255,255,1.00);
		box-shadow: 0px 0px 5px 3px rgba(255,255,255,1.00);

	}
	.message_texte{
		width:100%;
		margin:0 auto;
		text-align:justify;
		text-shadow:
			0 0 1px #000000,
			0 0 2px #000000,
			0 0 4px #000000,
			0 0 6px #000000;
		font-family:"OneColorLight";
	}
		.message_texte span{
			white-space: pre;
		}
		.texte_addon{
			width:100%;
		}
	.message_texte_big{
		text-align:justify;
		font-size:50px;
	}

	.one_color_work_title{
		width:100%;
		font-size:60px;
		vertical-align:middle;
		text-align:center;
		white-space: nowrap;
		letter-spacing:3px;
		margin:20px 0 0 0 !important;
		padding-bottom:23px!important;
		align-self: flex-end;
		position:relative;
		text-transform:uppercase;
	}
	#one_color_project{
		width:100%;
	}
		.one_color_project_tr{
			
		}
			.one_color_project_td{
				display:block;
				position:relative;
				background-position:center center;
				background-size:cover;
				margin:20px 0;
			}
				.one_color_project_td_scroll{
					width:100%;
					height:100%;
					position:absolute;
					background-color:rgba(0,0,0,0.70);
					display: flex;
					flex-direction: column;
					justify-content: center;
					left:0;
					top:0;
				}
					.one_color_project_td_scroll div{
						color:#FFFFFF;
						text-align:center;
					}
					.one_color_project_td_scroll_marque{
						padding:10px 0 0 0;
						text-transform:uppercase;
					}
					.one_color_project_td_scroll_marque span{
						letter-spacing:normal!important;
					}
					.one_color_project_td_scroll_description{
						letter-spacing:1px!important;
						display:flex;
						justify-content:center;
						align-items:center;
						flex: 1;
					}
					.one_color_project_td_scroll_famille{
						text-transform:uppercase;
					}
		.project_img{
			width:100%;
			margin:15px 0px;
			-webkit-box-shadow: 3px 4px 6px 3px rgba(0,0,0,0.80);
			-moz-box-shadow: 3px 4px 6px 3px rgba(0,0,0,0.80);
			box-shadow: 3px 4px 6px 3px rgba(0,0,0,0.80);

		}
		.goBack{
			position:absolute;
			right:12px;
			top:0px;
		}
	#one_color_work{
		width:100%;
	}
		.one_color_work_tr{
		}
			.one_color_work_td{
				width:100%;
				height:240px;
				margin:10px 0;
				display:flex;
				flex-direction: column;
				overflow:hidden;
				border:1px #000000 solid;
			}
			.one_color_work_td.no_border{
				border:none;
			}
				.one_color_work_td_titre{
					height:41px;
					width:100%;
					font-size:40px;
					line-height:41px;
					white-space: nowrap;
					text-transform: uppercase;
					padding:2px 0;
					text-align:center;
					overflow:hidden;
					text-overflow:"...";
					color:#000000;
				}
				.one_color_work_td_contenu{
					flex: 1;
					background-color:inherit;
					background-position: center left 10px;
					background-repeat:no-repeat;
					background-size:auto;
				}
					.one_color_work_td_contenu_scroll{
						width: -moz-calc(100% - 260px);
						width: -webkit-calc(100% - 260px);
						width: -o-calc(100% - 260px);
						width: calc(100% - 260px);

						margin-left:250px;
						height: -moz-calc(100% - 20px);
						height: -webkit-calc(100% - 20px);
						height: -o-calc(100% - 20px);
						height: calc(100% - 20px);

						background-color:inherit;
						overflow-y:auto;
						padding:10px 0;
						text-transform:uppercase;
						color:#000000;
						font-size:19px;
					}
	.one_color_work_tr .one_color_work_td:nth-child(odd){
		background: #00cccc;
		background: -webkit-gradient(linear, left top, left bottom, from(#00cccc), to(#0033cc));
		background: -webkit-linear-gradient(top, #00cccc, #0033cc);
		background: -moz-linear-gradient(top, #00cccc, #0033cc);
		background: -ms-linear-gradient(top, #00cccc, #0033cc);
		background: -o-linear-gradient(top, #00cccc, #0033cc);
		background: linear-gradient(to bottom, #00cccc, #0033cc);
		background: linear-gradient(#00cccc,#0033cc);

	}
	.one_color_work_tr .one_color_work_td:nth-child(even){
		background: #ff99cc;
		background: -webkit-gradient(linear, left top, left bottom, from(#ff99cc), to(#0033cc));
		background: -webkit-linear-gradient(top, #ff99cc, #0033cc);
		background: -moz-linear-gradient(top, #ff99cc, #0033cc);
		background: -ms-linear-gradient(top, #ff99cc, #0033cc);
		background: -o-linear-gradient(top, #ff99cc, #0033cc);
		background: linear-gradient(to bottom, #ff99cc, #0033cc);
		background: linear-gradient(#ff99cc,#0033cc);

	}






	@media screen and (max-height:500px){
		#title{
			display:none!important;
			visibility:hidden;
		}
		
	}
}


	/*=============================================================================*\
	=										=
	=				SMARTPHONE DESIGN				=
	=										=
	\*=============================================================================*/


@media screen and (max-width:499px){

	body{
		font-size:15px;
	}
			#title{
				height:70px;
				font-size:70px;
				line-height:70px;
			}
			#menu{
				font-size:15px;
				line-height:15px;
			}
		#body{
			width:100%;
			padding:0;
			overflow-x:hidden;
		}
			#background_intro{
				background-size:contain;
			}
		#footer{
			height:12px;
			font-size:12px;
			line-height:12px;
		}
			#footer a img{
				max-height:12px;
			}
	.message_texte{
		font-family:"OneColor";
		text-align:justify;
	}
	.message_texte_big{
		font-size:30px;
	}
	
	

	.one_color_work_title{
		font-size:46px;
	}
			.one_color_work_td_contenu{
				background-size:20%;
				background-position:center left 5px;
			}
				.one_color_work_td_contenu_scroll{
					width: -moz-calc(100% - 100px);
					width: -webkit-calc(100% - 100px);
					width: -o-calc(100% - 100px);
					width: calc(100% - 100px);

					margin-left:100px;
				}






}


	/*=============================================================================*\
	=										=
	=				ALL DESIGN					=
	=										=
	\*=============================================================================*/


html{
	position:fixed;
}
html,body{
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	background-attachment: fixed;
}
.hidden{
	display:none;
	visibility:hidden;
}
.no_select {
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
	cursor:default;
}
.pointer,
a{
	cursor:url("https://www.one-color.com/img/cursor_hand.png") 7 3, pointer!important;
	text-decoration:none;
}
.loading{
	background:transparent url(https://www.one-color.com/img/loading.gif) no-repeat center center;
}
	.conteneur_activites .activite_titre{
		text-shadow:
			0 0 1px #000000,
			0 0 2px #000000,
			0 0 4px #000000,
			0 0 6px #000000,
			0 0 8px #000000,
			0 0 10px #000000;
		height:80px;
		display:flex;
		flex-direction:column;
		justify-content: center;
		align-items: center; 
	}
		.conteneur_activites .activite_titre>span{
		}

.OneColorLight_font{
	font-family: "OneColorLight","HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.OneColorUltraLight_font{
	font-family: "OneColorUltraLight","HelveticaNeue-UltraLight", "Helvetica Neue Ultra Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	letter-spacing:5px;

}
	.OneColorUltraLight_font>span{
		letter-spacing:4.2px;
		font-size: 9px;
		line-height: 13px;
		position: relative;
		vertical-align: top;
	 }
.OneColorCondensedBlold{
	font-family: "OneColorCondensedBold", Helvetica, Arial, "Lucida Grande", sans-serif;

}
.CreamRecords_font{
	font-family: "CreamRecords";
	letter-spacing:5px;
}
.HeroesStudio_font{
	font-family: "HeroesStudio";
	letter-spacing:5px;
}
	.HeroesStudio_font sub{
		font-size: 20px;
		line-height: 0;
		position: relative;
		vertical-align: baseline;
	 }
.OneColorComm_font{
	font-family: "OneColorComm";
	letter-spacing:-3px;
}
.NightColours_font{
	font-family: "NightColours";
	letter-spacing:3px;
}
.VelvetModels_font{
	font-family: "VelvetModels";
	letter-spacing:3px;
}
.VelvetModelsBold_font{
	font-family: "VelvetModelsBold";
}
.VelvetModelsItalic_font{
	font-family: "VelvetModelsItalic";
}
.left{
	text-align:left!important;
}

#debug_erreur{
	max-height:300px;
	width:400px;
	padding:10px;
	position:fixed;
	bottom:10px;
	right:10px;
	font-size:12px;
	overflow-y:auto;
	background-color:#FF8080;
	border:2px #600000 inset;
	zoom: 1;
	filter: alpha(opacity=50);
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	-moz-opacity:0.5;
	-khtml-opacity:0.5;
	opacity: 0.5;

}
#debug_erreur:hover{
	zoom: 1;
	filter: alpha(opacity=100);
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	-moz-opacity:1;
	-khtml-opacity:1;
	opacity: 1;

}
#debug_erreur span{
	margin:5px 0;
	display:block;
}