<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/* POLICES DE CARACTERES */
@font-face
{
  font-family: 'SyntaxSans-9-BlackOsF';
  src: url(/fr/_fonts/SyntaxSans-9-BlackOsF.otf);
}

@font-face
{
  font-family: 'SyntaxSans-3-LightSC';
  src: url(/fr/_fonts/SyntaxSans-3-LightSC.otf);
}

@font-face
{
  font-family: 'WebSymbolsRegular';
  src: url(/fr/_fonts/webSymbols-Regular-webfont2.ttf) format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face
{
  font-family: 'Terminal Dosis';
  font-style: normal;
  font-weight: 400;
  src: local('Terminal Dosis Book'), local('TerminalDosis-Book'), url(/fr/_fonts/TerminalDosis.ttf) format('truetype');
}

@font-face
{
  font-family: 'Cantarell';
  src: url(/fr/_fonts/Cantarell.ttf);
}/*****************
 * ANIMATIONS
 *****************/
@-webkit-keyframes moveFromRight
{
  from
  {
    -webkit-transform: translateX(200%);
    opacity: 0;
  }
  to
  {
    -webkit-transform: translateX(0%);
    opacity: 1;        
  }
}
@-moz-keyframes moveFromRight
{
  from
  {
    -moz-transform: translateX(200%);
    opacity: 0;
  }
  to
  {
    -moz-transform: translateX(0%);
    opacity: 1;        
  }
}
@-o-keyframes moveFromRight
{
  from
  {
    -o-transform: translateX(200%);
    opacity: 0;
  }
  to
  {
    -o-transform: translateX(0%);
    opacity: 1;        
  }
}
@-ms-keyframes moveFromRight
{
  from
  {
    -ms-transform: translateX(200%);
    opacity: 0;
  }
  to
  {
    -ms-transform: translateX(0%);
    opacity: 1;        
  }
}
@keyframes moveFromRight
{
  from
  {
    transform: translateX(200%);
    opacity: 0;
  }
  to
  {
    transform: translateX(0%);
    opacity: 1;        
  }
}

@-webkit-keyframes moveFromTop {
  from
  {
    -webkit-transform: translateY(-100%);
    opacity: 0;
  }
  to
  {
    -webkit-transform: translateY(0%);
    opacity: 1;        
  }
}
@-moz-keyframes moveFromTop {
  from
  {
    -moz-transform: translateY(-100%);
    opacity: 0;
  }
  to
  {
    -moz-transform: translateY(0%);
    opacity: 1;        
  }
}
@-o-keyframes moveFromTop {
  from
  {
    -o-transform: translateY(-100%);
    opacity: 0;
  }
  to
  {
    -o-transform: translateY(0%);
    opacity: 1;        
  }
}
@-ms-keyframes moveFromTop {
  from
  {
    -ms-transform: translateY(-100%);
    opacity: 0;
  }
  to
  {
    -ms-transform: translateY(0%);
    opacity: 1;        
  }
}
@keyframes moveFromTop {
  from
  {
    transform: translateY(-100%);
    opacity: 0;
  }
  to
  {
    transform: translateY(0%);
    opacity: 1;        
  }
}
/*****************
 * GENERAL
 *****************/
body
{
	background-image: url(/fr/_img/background-gris.jpg);
	background-repeat: no-repeat;
	background-color: #eaf1f8;
}

p,li,span,footer,body
{
	font-family:Cantarell,sans-serif;
	font-weight:normal;
	font-size:14px;
}

#fullpage
{
	margin-left: auto;
  margin-right: auto;
	width:975px;
	padding:12px;
	/*border:none;*/
}

#main-content
{
	margin-left:150px;
	padding-top: 80px;
	min-height:300px;
}

h1
{
	font-family:SyntaxSans-9-BlackOsF,sans-serif;
	font-variant:small-caps;
	font-size:28px;
}

h2
{
	font-family:Cantarell,sans-serif;
	font-weight:bold;
	font-size:22px;
}

h3
{
	font-family:Cantarell,sans-serif;
	font-weight:normal;
	font-size:20px;
}

ul {list-style: none;}

/*****************
 * CONTENU
 *****************/
article#main-content
{

}
/*****************
 * LOGO
 *****************/
#logo
{
	display:inline-block;
	vertical-align:middle;
	height:120px;
	float:left;
}

#logo-circle-container
{
	position:absolute;
	width:120px;
	height:120px;
	-webkit-transition:transform 500ms ease-in-out;
	-moz-transition:transform 500ms ease-in-out;
	-o-transition:transform 500ms ease-in-out;
	-ms-transition:transform 500ms ease-in-out;
	transition:transform 500ms ease-in-out;
}

#logo-circle-container:hover &gt; div
{
	-webkit-transform: rotateY(360deg);
	-moz-transform: rotateY(360deg);
	-o-transform: rotateY(360deg);
	-ms-transform: rotateY(360deg);
	transform: rotateY(360deg);
	-webkit-transition:all 1s ease;
	-moz-transition:all 1s ease;
	-o-transition:all 1s ease;
	-ms-transition:all 1s ease;
	transition:all 1s ease;
}

#logo-circle
{
	border-radius:50%;
	background-color:#666;
	width:120px;
	height:120px;
}

#logo-text-kd
{
	position:relative;
	top:25px;
	left:10px;
	font-size:60px;
	font-family:SyntaxSans-9-BlackOsF,sans-serif;
	color:white;
}

#logo-text-labs
{
	position:relative;
	top:36px;
	left:140px;
	font-size:40px;
	font-family: 'SyntaxSans-3-LightSC';
	color:#666;
	letter-spacing:25px;
}/*****************
 * FOOTER
 *****************/
footer
{
	display:block;
	margin-top:30px;
	border-top: solid 1px #e1e1e1;
	color:#bbb;
	text-align:right;
	font-size:10px;
}
footer a
{
	color:#aaa;
	text-decoration:none;
	font-size:10px;
}
footer a:hover
{
	color:#333;
	text-decoration:underline;
	font-size:10px;
}/*****************
 * MENU DE GAUCHE
 *****************/
#left-menu
{
  display:block;
  float:left;
  margin-top:20px;
}
#left-menu &gt; div#left-circle
{
  width: 100px;
  height: 100px;
  border: 10px solid;
  overflow: hidden;
  border-radius:50%;
}
#left-menu &gt; div#left-circle &gt; span.icon
{
  font-family: 'WebSymbolsRegular', cursive;
  font-size: 40px;
  line-height: 60px;
  position: relative;
  width: 100%;
  height: 60px;
  left: 30px;
  top: 25px;
  text-align: center;
  opacity:1;
}

#left-menu &gt; ul
{
	border: none;
	padding:0px;
	background: transparent !important;
}
#left-menu li
{
  width: auto;
  height: auto;
  overflow: hidden;
  position: relative;
  display: block;
  -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  -o-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  -ms-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  margin-left:0px;
  margin-bottom: 4px;
  border-radius:8px;
  padding:5px;
  -webkit-transition: all 150ms linear;
  -moz-transition: all 150ms linear;
  -o-transition: all 150ms linear;
  -ms-transition: all 150ms linear;
  transition: all 150ms linear;
}
#left-menu li:last-child
{
  margin-bottom: 0px;
}
#left-menu li a
{
  text-align: left;
  width: 100%;
  height: auto;
  display: block;
  position: relative;
  text-decoration:none;
  font-size: 20px !important;
  font-weight: bold !important;
  font-family: 'Terminal Dosis', cursive !important;
  white-space: nowrap;
	-webkit-transition: all 100ms linear;
  -moz-transition: all 300ms linear;
  -o-transition: all 300ms linear;
  -ms-transition: all 300ms linear;
  transition: all 300ms linear;
}
#left-menu li:hover a span
{
	display:block;
  -webkit-animation: moveFromRight 300ms ease-in-out;
  -moz-animation: moveFromRight 300ms ease-in-out;
  -o-animation: moveFromRight 300ms ease-in-out;
  -ms-animation: moveFromRight 300ms ease-in-out;
  animation: moveFromRight 300ms ease-in-out;
}
.subtitle
{
    width: auto;
    height: auto;
    overflow: hidden;
    position: relative;
    display: inline-block;
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -o-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    -ms-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
    margin-left:0px;
    margin-bottom: 4px;
    margin-top:20px;
    border-radius:8px;
    padding:5px;
    text-decoration:none;
    font-size: 20px;
    font-weight: bold;
    font-family: 'Terminal Dosis', cursive;
    background-color:rgba(255,255,255,0.4);
    border: solid 5px;
}
/*****************
 * MENU DU HAUT
 *****************/
nav#top-menu
{
  padding: 0;
}
nav#top-menu li
{
  width: 100px;
  height: 100px;
  border: 10px solid #f6f6f6;
  overflow: visible; /* nÃ©cessaire au tooltip */
  float:right;
  margin-left:-38px;
  opacity:1;
  position:relative;
  -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  -moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  -o-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  -ms-box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  -webkit-border-radius: 125px;
  -moz-border-radius: 125px;
  -o-border-radius: 125px;
  -ms-border-radius: 125px;
  border-radius: 50%;
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -o-transition: all 400ms ease;
  -ms-transition: all 400ms ease;
  transition: all 400ms ease;
}
nav#top-menu li:hover
{
    z-index: 999;
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    transition: all 400ms ease;
}
nav#top-menu li a
{
  text-align: left;
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  text-decoration:none;
}
nav#top-menu a span.icon
{
  font-family: 'WebSymbolsRegular', cursive;
  font-size: 40px;
  position: relative;
  width: auto;
  left: 0px;
  top: 30px;
  text-align: center;
  opacity:0.4;
  display:block;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
nav#top-menu li:hover a span.icon
{
	opacity:1;
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -o-transition: all 400ms ease;
  -ms-transition: all 400ms ease;
  transition: all 400ms ease;
}
nav#top-menu li a span.text
{
	z-index:-1;
	width: 100px;
	height: auto;
	line-height: 20px;
	padding: 10px;
	left: 50%;
	margin-left: -64px;
  font-family: 'Terminal Dosis', cursive;
	/*font-family: 'Alegreya SC', Georgia, serif;*/
	font-weight: 400;	
	font-style: normal;
	font-size: 18px;
	color: #719DAB;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
	text-align: center;
	border: 4px solid #fff;
	background: rgba(255,255,255,0.3);
	text-indent: 0px;
	border-radius: 5px;
	position: absolute;
	pointer-events: none;
	top: 60px;
	opacity: 0;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
nav#top-menu span.text:before,
nav#top-menu span.text:after
{
	content: '';
	position: absolute;
	top: -15px;
	left: 50%;
	margin-left: -9px;
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid rgba(0,0,0,0.1);
}
nav#top-menu span.text:after
{
	top: -14px;
	margin-left: -10px;
	border-bottom: 10px solid #fff;
}
nav#top-menu li a:hover span.text
{
	z-index:0;
	opacity: 0.9;
	top: 120px;
}
nav#top-menu #back { margin-right:80px !important; }
.error-descriptioncolors { color: #aa0c0c !important }

/* personnalisation selon l'Ã©lÃ©ment du menu */
.wsc-rotate:hover span.icon { -webkit-transform: rotate(20deg) !important }
.softwares-rotate:hover span.icon { -webkit-transform: rotate(20deg) !important }
.about-rotate:hover span.icon { -webkit-transform: rotate(-380deg) !important }
.contact-rotate:hover span.icon { -webkit-transform: rotate(-20deg) !important }
.music-rotate:hover span.icon { -webkit-transform: rotate(380deg) !important }

.wsc-colors { background-color: #e8f3f8 !important; color: #81a8b8 !important }
.wsc-colors:hover { border-color: #81a8b8 !important }
.wsc-colors a { color: #81a8b8 !important }
.wsc-bordercolors { border-color: #81a8b8 !important }
.wsc-hovercolors:hover { background-color: #81a8b8 !important }
.wsc-hovercolors:hover a { color: #e8f3f8 !important }
.wsc-descriptioncolors { color: #81a8b8 !important }
.wsc-invertedcolors { background-color: #bbd6bb !important; color: #e8f3f8 !important }

.softwares-colors { background-color: #e8f3f8 !important; color: #81a8b8 !important }
.softwares-colors:hover { border-color: #81a8b8 !important }
.softwares-colors a { color: #81a8b8 !important }
.softwares-bordercolors { border-color: #81a8b8 !important }
.softwares-hovercolors:hover { background-color: #81a8b8 !important }
.softwares-hovercolors:hover a { color: #e8f3f8 !important }
.softwares-descriptioncolors { color: #81a8b8 !important }
.softwares-invertedcolors { background-color: #bbd6bb !important; color: #e8f3f8 !important }
.softwares-downloadcolors { background-color: #81a8b8 !important }

.about-colors { background-color: #f4eded !important; color: #b58484 !important }
.about-colors:hover { border-color: #b58484 !important }
.about-colors a { color: #b58484 !important }
.about-descriptioncolors { color: #b58484 !important }

.contact-colors { background-color: #edf4ed !important; color: #84b584 !important }
.contact-colors:hover { border-color: #84b584 !important }
.contact-colors a { color: #84b584 !important }
.contact-descriptioncolors { color: #84b584 !important }

.music-colors { background-color: #f1edf4 !important; color: #a384b5 !important }
.music-colors:hover { border-color: #a384b5 !important }
.music-colors a { color: #a384b5 !important }
.music-bordercolors { border-color: #a384b5 !important }
.music-hovercolors:hover { background-color: #a384b5 !important }
.music-hovercolors:hover a { color: #f1edf4 !important }
.music-descriptioncolors { color: #a384b5 !important }
.music-invertedcolors { background-color: #ccbbd6 !important; color: #f1edf4 !important }

.top-menu #menu-back { margin-right:80px !important; }
.back-colors { background-color: #f0f0f0 !important; color: #9c9c9c !important }
.back-colors a { color: #9c9c9c !important }
.back-colors:hover { border-color: #9c9c9c !important }


body
{
	background-image: url(/fr/_img/background-vert.jpg) !important;
}

#left-circle span.icon { left:22px !important; }
</pre></body></html>