<!-- 
                                                                                                                                                                                                        
                                                                              ........''.'''''..''........                                                                                              
                                                                      .....',,,,,,,,,,;;,;,,,,;;;;;;;;::;;,,''....                                       ..                                             
                                                                 ...'',,,,'',,,,,'''.......................'',;;:;,'...                                  .c'                                            
                                                             ...',,,'',,,,'.....                               ....',;:;'..                              .:,.                                           
                                                          ..',,,'',,,''..                              .;.           ...',;;.                            .;;.                                           
                                                      ..',,,''',,'...                            .;.    ;:.                .                             .;;.                                           
                                                    .',,'''',,'..                                ::. .. .:'                     ..                       .;;,                                           
                                                 ..,,'''',,'.                                   ':'.,l: .,'.                    .:,.                     .,,,.                                          
                                               .',,''',,'.                                     ';,..co: .'...                    .,;'.                   .,';.                                          
                                             .','''',,..                                .;,. .'',. ;oo;  ',..'.                    .;;,.                 .,';'                                          
                                           .,,'''','.                                 .;c,  .'.'' .:ll;  .,...'.                    .';,,.               .;',,.                                         
                                         .','''',,.                                .';c:. ..'..'. ,c:c;.  .'....'.                    .,,,,.             .;'';.                                         
                                       .','''',,'.                              ..,:c:'  .'...'. .::;c;    ''.......                    ',,,,..          .;'';'                                         
                                      .;,'''',,.                             .';:cc;'. .....''  .;c:;c;     '.........                   .,,',,'.        .;,',,.                                        
                                    .',,''',,.                            .';:c::,.  ......'.  .;c:::l;      .'.........                   .,,',,'.      .:,',;.                                        
                                   .,,'''',,.                         ..,;:::::,.  .........  .;c::::c'       .'..........                  .','',,..    .:,'';'                                        
                                  .;,'''';'                       ..,;:c::::;'. ..........   .::::;:l:.        .............                  .,,'',,..  .;,'';,                                        
                                 ';''''';'                     .';:c::::c:,. ...........   .,::::;:cl,           .'...........                 .',,'',,...;,'',,.                                       
                                ';'''',;.                  ..,;cc::::c:,.. ..'.....'..   .':::;::;c:;.             .............                 .,,''''',:;''';.                                       
                               ';'''',;.                ..;:c:::::c:,.. ........'..    .':::::::::c,                 ............                  .,,'''',::;,;'                                       
                              ';'''',;.               .;:c:::;:c:,.. ............   .';:::::;::::c;.                   ..........'.                 .',''''',::c;.                                      
                             ';''''';'             .,:::::::::;'. .........'..    .,:c:;::::::::c;.         ........   '...'......'.                  .,,''''';c:.                                      
                            .;,'''';,.           .,:::::::c:'...............   .';:::::;::::;;:c;.    ...',,;:::::::;..,c,..'......'.                  .',,':do;,,.                                     
                           .,,'''',;.          .,:::;;:::,...............   .';:::::::::::::::c,...',,;;;;;;,'......';,.;l:. .'....''                    .,,cxd;'',,.                                   
                           ';''''';'          ':::::::;'...............   .,::::;::;:;::::::c:..,:,,,,;;,'..            'ccc' .'....,.                    'c;,''''',,,.                                 
                          .;,'''',,.        .;c::::c;'  .'..........   .';c:;::;;::::::::::c;.  .;;,''..                .c::c. .'...,.                    ,:;:;,,''''','.                               
                          ';''''';'        .:c::::;'  .'..........   .,:::;::::::::;;::;:::.      .             .:,     .;c:c:..'...,.                    ,;',;:;,,,,''','.                             
                         .,,''''';.       .;c::::'  .'........'.   .,::::;::::::::::::::;.                   .',:c:;.   .:c::c' .'..,.                    ,;''';,  ..',,'','.                           
                         .;,'''',;.       ,c:::;. .''.......'.   .':::::::::::::;;::::;.       .   ..''..'',;;;,,;cl:.  .c:;:c; .,..'.                    ;:'',;.     ..',,,,'...                       
                         ';''''','       .::::'  .'........'.   .:c:;::;::;;::::;;::,.        ';. .;;;::;;;,,,,;;;;'.   ,c:::c; ',.'.                     ,:'';,          ..',,,,,,;,'..                
                        .,;''''',.       ,c:c'  .'.......'.    ,c::::::;:::::::;::,.         .c:       .....''....     .:c;::c, .,''.                     ,;',;.             ';,,'...',;,.              
                        .;,''''';'      .;c:.  ''.......'.   .;c:::::::::::;::::,.           'c'                       .c:;;:c. .,,.                      ':';'              .,;'      .;:.             
                        .;,''''':'      .cc.  ''.......''   .:::::;::;::::::::;.             ,l.                       ,c::;c:..,:.                       ':,,.              .,:,       ,l,             
                        .,,''''':'      'l'  ''.......''   .:c:::;::::::::::c'               .l;                      .:c:::l, .:,                        ,;,,.               .,;,.    .,:,             
                        .,,''''';.      ..  .,.......''   .;c:::::::::::::c:.                 ,c.                     .cc;::c' ';.                      .';;,;,.                .,;;;,;;;,;'..          
                        .;,''''',.         .'........,.   ,c::;::::::::::c;.                   ..                  ;' .cc;::c'                         .;;'...,:,.                 .......',;:'         
                        .;,''''';,         .'.......'.   .::::::::::::::c:.            ,;.   .;,.                 'c. .:c;::c,                        .;:.     ,:,                          ..          
                         ,;''''',,.       .,........,.   ,c:::::::::::::c'             .''.  ',.                 .c,   ,c:::c:.                       .::.     ':;.                                     
                         ';'''''';.       .'........'.   ;c:::::::::::;:;.                                      .c:.   .;c::::;.                      .;:'    .,:;.                                     
                         .;,''''';,       .'.........   .cc;::::::::::;c:.                                     .c:.     .;c:::::.                      .;;,...,;,.                                      
                          ,,'''''';.      .,.........   .c:;::::::::::;c:.        .'.',,;;,,,;;,''.''.        .c:.       .,c:;:::;..                     .',,,'.                                        
                          .;'''''';,      .'........,.  .:c;::::::::::;:c'        .,;;,,,,,,,,,,,;:,'.       ,c;.          .,:::::c:,'..                                                                
                          .,;'''''';.     .'........'.   ,c:;::::::::::;c:.         .,;,;codoc;,;'.        .;:,.             ..,;::ccllc:,'..             ...                                           
                           .;'''''',;.     ''........'   .c::;:::::::::::c:.          .',;ccc:,'.        .'::.                    .......               .,;;;.                                          
                            ';'''''';,.    .,........'.   ;c:;::::::::::::::.            .....          .;:;.                                           ,;';'                                           
                            .,,'''''';,     .,........,.  .:c::;::::::::;::::,. ..                    .,:;c'                                           ';';,.                                           
                             .;,'''''';,     .'........,.  .;c:;:::::::::::;:c:..,:,.             .';::,;:c'                                          ';',;.                                            
                              .;,'''''';,.    .'........'.  .,c:;:::::::::::::::;'',:;'...   ...,;:;'.. 'c:,                                         ';',;.                                             
                               .;,'''''',,.    .'........'.   '::::::::::::::::::::,..,;:::::::;,..     .::,                                       .,,',;.                                              
                                .;''''''',,.     .'..........  .,::::::::::::::::;:::'.  .....          .;c;.                                     .,,',;.                                               
                                 .;,'''''',,.     ............   .':::::::::::::;;:::::'                 '::.                                    .;,',;.                                                
                                  .,,''''''',,.     ............   .';::;;:::::;::::::::;.               .;c,                                  .','',,.                                                 
                                   .',''''''',,.       ...'.....'..   .;:::::::::::;:::;:c,               ':;.                                .,,',,'                                                   
                                     .,,''''''',,.        ...........   .;::::;::::::;:;::c;.             .,:;.                             .,,'',,.                                                    
                                      .,,'''''''','.          .....',,'.  .,::::::::::;::;:c;              .;:,.                          .','',,'.                                                     
                                        .,,''''''',,'.            ....',,'. .':::;:::;;::;::c'              .,c;.                       .',,'',,.                                                       
                                          .,,'''''''',,..                     .,:::::::;::;;c:.               .::.                   ..',''',,.                                                         
                                           ..,,'''''''',,'.                     .;c::::::::::c.                 .'                 .',,''',,.                                                           
                                             .',,''''''''',,'.                   .;c::::::;::c'                                 .',,'''',,.                                                             
                                               ..,,,'''''''',,,'..                 ;c:::;:::::.                             ..',,,''',,'.                                                               
                                                  .',,'''''''''',,'...             .::;::::;c;.                         ...',,'''',,,..                                                                 
                                                     .',,,''''''''',,,''...         ;c::::::c'                     ...',,,,''''',,'.                                                                    
                                                        .',,,''''''''''',,,,'.      ,c:::;:c,               .....',,,,'''''',,,'.                                                                       
                                                           ..',,,'''''''''',;.      ;c;:;:c,     .....'..',,,,,,'''''''',,,'..                                                                          
                                                               ..',,,,'''''';,     .c:;;:c'   ..,,,,,,''''''''''''',,,,'..                                                                              
                                                                   ...'',,,,,;.   .;c:::;.  .',,''''''''''''',,,,''...                                                                                  
                                                                        .....'.   ,c:::'   .:;,,,,;;,,,,,'''....                                                                                        
                                                                                 ,cc:'.    ...........                                                                                                  
                                                                               .:c:'.                                                                                                                   
                                                                               .,.                                                                                                                      
                                                                                                                                                                                                        
                                                                                                                                                                                                        
-->
<!DOCTYPE html>
<html lang="fr">
<head>
<title>FlipBook Guide Technique CCD</title>
<link rel="icon" href="https://www.ciseaux-coiffure-diffusion.fr/data/medias/theme/lp6/logo.jpg" />
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<style type="text/css">
* { box-sizing: border-box; }

/* FlipBook */

body {
  /* or any other parent wrapper */
  margin: 0;
  display: flex;
  min-height: 100dvh;
  perspective: 1000px;
  font: 1em/1.4 "Poppins", sans-serif;
  overflow: hidden;
  color: hsl(180 68% 5%);
  background: rgba(255,255,255,0.8);
}

.book {
  position: relative;
  display: flex;
  margin: auto;
  width: 40cqmin;
  /*1* let pointer event go trough pages of lower Z than .book */
  pointer-events: none;
  transform-style: preserve-3d;
  transition: translate 1s;
  translate: calc(min(var(--c), 1) * 50%) 0%;
  /* Incline on the X axis for pages preview */
  rotate: 1 0 0 30deg;
}

.page {
  /* PS: Don't go below thickness 0.5 or the pages might transpare */
  --thickness: 4;
  flex: none;
  display: flex;
  width: 100%;
  font-size: 2cqmin;
  /*1* allow pointer events on pages */
  pointer-events: all;
  user-select: none;
  transform-style: preserve-3d;
  transform-origin: left center;
  transition:
    transform 1s,
    rotate 1s ease-in calc((min(var(--i), var(--c)) - max(var(--i), var(--c))) * 50ms);
  translate: calc(var(--i) * -100%) 0px 0px;
  transform: translateZ( calc((var(--c) - var(--i) - 0.5) * calc(var(--thickness) * .23cqmin)));
  rotate: 0 1 0 calc(clamp(0, var(--c) - var(--i), 1) * -180deg);
}

.front,
.back {
  position: relative;
  flex: none;
  width: 100%;
  backface-visibility: hidden;
  overflow: hidden;
  background-color: #fff;
  /* Fix backface visibility Firefox: */
  translate: 0px;
}

.back {
  translate: -100% 0;
  rotate: 0 1 0 180deg;
}


/* That's it. Your FlipBook customization styles: */

.book {
  counter-reset: page -1;
  & a {
    color: inherit;
  }
}

.page {
  box-shadow: 0em .5em 1em -.2em #00000020;
  background: rgba(255,255,255,0.8);
}

.front,
.back {
  display: flex;
  flex-flow: column wrap;
  justify-content: space-between;
  padding: 2em;
  border: 1px solid #0002;
  
  &:has(img) {
    padding: 0;
  }
  
  & img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  &::after {
    position: absolute;
    bottom: 1em;
    counter-increment: page;
    content: counter(page) ".";
    font-size: 0.8em;
  }
}
.cover {
  &::after {
    content: "";
  }
}
.front {
  &::after {
    right: 1em;
  }
  background: linear-gradient(to left, #f7f7f7 80%, #eee 100%);
  border-radius: .1em .5em .5em .1em;
}
.back {
  &::after {
    left: 1em;
  }
  background-image: linear-gradient(to right, #f7f7f7 80%, #eee 100%);
  border-radius: .5em .1em .1em .5em;
}

.cover {
  background: radial-gradient(circle farthest-corner at 80% 20%, hsl(150 80% 20% / .3) 0%, hsl(170 60% 10% / .1) 100%),
    hsl(231, 32%, 29%) url("https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_3_f0fa9110-11b6-4bbe-b66d-05bdfca0bf38.jpg") 50% / cover;
  color: hsl(200 30% 98%);
}


:root {
  --color-black: hsl(0, 0%, 10%);
  --color-white: hsl(0, 0%, 100%);
  --color-darken: hsl(0, 0%, 20%);
  --color-teal-100: hsl(160, 85%, 87%);
  --color-teal-200: hsl(162, 78%, 77%);
  --color-teal-300: hsl(162, 72%, 65%);
  --color-teal-400: hsl(162, 68%, 54%);
  --color-teal-500: hsl(162, 73%, 46%);
  --color-teal-600: hsl(162, 82%, 40%);
  --color-teal-700: hsl(162, 87%, 35%);
  --color-teal-800: hsl(162, 88%, 30%);
  --shadow-small: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  --shadow-medium: 0 -4px 6px -1px rgba(0, 0, 0, 0.1),
  	0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-large: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
  	0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

*,
*::before,
*::after {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  list-style: none;
  list-style-type: none;
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

html {
  font-size: 100%;
  box-sizing: inherit;
  scroll-behavior: smooth;
}

body {
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--color-black);
}

a,
button {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  cursor: pointer;
  border: none;
  outline: none;
  background: none;
  text-decoration: none;
}

img,
video {
  display: block;
  max-width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}

.container {
  max-width: 75rem;
  height: auto;
  margin: 0 auto;
  padding: 0 1.25rem;
}

.brand {
  font-family: inherit;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.15;
  color: var(--color-teal-800);
  text-transform: uppercase;
}

.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 100;
}

.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 4rem;
  margin: 0 auto;
}

.menu {
  position: fixed;
  left: 0;
  bottom: 0;
  display: grid;
  align-content: center;
  width: 100%;
  height: 3.5rem;
  padding: 0 1rem;
  border-top-left-radius: 1.5rem;
  border-top-right-radius: 1.5rem;
  background: var(--color-white);
  box-shadow: var(--shadow-medium);
}
.menu-list {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.menu-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: none;
  outline: none;
  color: var(--color-black);
}
.menu-link.is-active {
  position: relative;
  color: var(--color-teal-800);
  transition: all 0.35s ease;
}
.menu-icon {
  font-size: 1.35rem;
  line-height: 1;
  color: inherit;
}
.menu-name {
  display: none;
  font-family: inherit;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25;
  visibility: hidden;
  text-transform: capitalize;
}

@media only screen and (min-width: 360px) {
  .menu-name {
    display: block;
    visibility: visible;
  }
}
@media only screen and (min-width: 576px) {
  .menu-list {
    justify-content: center;
    -moz-column-gap: 3rem;
         column-gap: 3rem;
  }
}
@media only screen and (min-width: 768px) {
  .header {
    background: var(--color-white);
    box-shadow: var(--shadow-medium);
    transition: all 0.35s ease-in-out;
  }

  .menu {
    position: relative;
    top: 0;
    right: 0;
    width: auto;
    height: auto;
    background: none;
    box-shadow: none;
  }
  .menu-link.is-active::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 2rem;
    height: 2px;
    border: none;
    outline: none;
    background: var(--color-teal-800);
  }
  .menu-link:hover {
    color: var(--color-teal-800);
    transition: all 0.35s ease;
  }
  .menu-icon {
    display: none;
    visibility: hidden;
  }
  .menu-name {
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 0.2rem;
  }
}


canvas{
  display:block;
  opacity: 0.1;
}

</style>
    
        <link rel="stylesheet" href="https://ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/plugins/pluxautomatic/APP/style.min.css">

     </head>

  <body class="block-center-center">
<canvas id='canv'></canvas>

<header class="header" id="header">
	<nav class="navbar container">
		<a href="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/static33/flipbook-guide-technique" class="brand">GUIDE TECHNIQUE CCD</a>
		<div class="menu" id="menu">
			<ul class="menu-list">
				<li class="menu-item">
					<a href="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/documents/CCD-OSAKA-Guide-Technique.pdf" target="_blank" class="menu-link is-active">
						<i class="menu-icon ion-md-home"></i>
						<span class="menu-name">Télécharger [PDF]</span>
					</a>
				</li>
				<!-- <li class="menu-item">
					<a href="https://ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/static33/flipbook-guide-technique#" class="menu-link is-active">
						<i class="menu-icon ion-md-home"></i>
						<span class="menu-name">Home</span>
					</a>
				</li>
				<li class="menu-item">
					<a href="https://ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/static33/flipbook-guide-technique#" class="menu-link is-active">
						<i class="menu-icon ion-md-home"></i>
						<span class="menu-name">Home</span>
					</a>
				</li>
				<li class="menu-item">
					<a href="https://ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/static33/flipbook-guide-technique#" class="menu-link">
						<i class="menu-icon ion-md-search"></i>
						<span class="menu-name">Search</span>
					</a>
				</li>
				<li class="menu-item">
					<a href="https://ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/static33/flipbook-guide-technique#" class="menu-link">
						<i class="menu-icon ion-md-cart"></i>
						<span class="menu-name">Cart</span>
					</a>
				</li>
				<li class="menu-item">
					<a href="https://ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/static33/flipbook-guide-technique#" class="menu-link">
						<i class="menu-icon ion-md-heart"></i>
						<span class="menu-name">Favorite</span>
					</a>
				</li>
				<li class="menu-item">
					<a href="https://ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/static33/flipbook-guide-technique#" class="menu-link">
						<i class="menu-icon ion-md-contact"></i>
						<span class="menu-name">Account</span>
					</a>
				</li> -->
			</ul>
		</div>
	</nav>
</header>

<div class="book" style="margin-left: -70%;">
  <div class="page">
    <div class="front cover" align="right">
      <h1 style="color: black;">GUIDE TECHNIQUE CCD</h1>
      <p style="color: black;">2024 | Première edition</p>
    </div>
    <div class="back cover">
      <h1 style="color: black;">LES CISEAUX</h1>
      <p style="color: black;">Fiches techniques OSAKA</p>
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_3_e1da96cc-4769-4dd1-8746-2803c919f783.jpg" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_1_c7f41cb0-deca-4ee7-b42c-e95d31d4689b.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">A</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/a7-p1.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/a7-p2.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/a740t-p3.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/a740t-p4.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ame-p5.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ame-p6.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/as-p7.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/as-p8.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ats147-p9.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ats147-p10.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ats314s-p11.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ats314s-p12.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_0_bde218f0-b762-4d2b-9427-1a34758b4386.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">B</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/basic-p13.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/basic-p14.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/basic-40t-p15.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/basic-40t-p16.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_0_0c2de246-66ec-4bfc-b93c-475cd8cc41d2.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">C</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/c2k-p17.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/c2k-p18.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/c2k-40t-p19.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/c2k-40t-p20.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/c4-p21.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/c4-p22.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ca-p23.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ca-p24.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cb-p25.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cb-p26.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cl25t-p27.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cl25t-p28.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/clduo-p29.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/clduo-p30.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/clx-p31.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/clx-p32.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/clx-30t-p33.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/clx-30t-p34.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cly-p35.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cly-p36.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/clz-p37.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/clz-p38.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cr-p39.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cr-p40.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cross-p41.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cross-p42.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cxa-30t-p43.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/cxa-30t-p44.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_0_36401b34-289f-4b21-a5a2-d4980abafadf.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">D</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/dome-p45.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/dome-p46.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_0_bde218f0-b762-4d2b-9427-1a34758b4386.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">E</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/edo-p47.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/edo-p48.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_1_c7f41cb0-deca-4ee7-b42c-e95d31d4689b.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">F</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/fader-p49.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/fader-p50.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/flat-p51.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/flat-p52.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/flat17-p53.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/flat17-p54.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_2_5234e800-2e03-4c10-883f-1973c326dcf1.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">G</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/gx-p55.png" alt="Img 1">
    </div>
  </div>


  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">G</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/gx-p55.png" alt="Img 1">
    </div>
  </div>


  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/gx-p56.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/gx-40t-p57.png" alt="Img 1">
    </div>
  </div>


  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/gx-40t-p58.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_3_e3558bc7-b6bd-44bf-842a-1dcdd80b94ed.jpg" alt="Img 1">
    </div>
  </div>


  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">H</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/hades-p59.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/hades-p60.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_2_f1a01ed2-9c90-41ec-8c1a-ef621dbba9d3.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">I</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ika-p61.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ika-p62.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ivy-p63.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ivy-p64.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_3_b8048569-76a8-48c3-8aa5-9c0292a8ee9a.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">J</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/jk-p65.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/jk-p66.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/jkn-p67.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/jkn-p68.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_2_8b0a74da-d43f-4c75-8782-129cc2a7c396.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">K</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/karasu-p69.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/karasu-p70.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_2_8b0a74da-d43f-4c75-8782-129cc2a7c396.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">M</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/mikazuki-p71.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/mikazuki-p72.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/mt-p73.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/mt-p74.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_2_5234e800-2e03-4c10-883f-1973c326dcf1.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">N</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ny-damas-p75.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ny-damas-p76.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ny-damas-p77.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ny-damas-p78.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/nymb-p79.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/nymb-p80.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_1_c7f41cb0-deca-4ee7-b42c-e95d31d4689b.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">R</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/rta-p81.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/rta-p82.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/rta-30t-p83.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/rta-30t-p84.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_1_07dbe6ef-1b6d-47e1-a0ab-b0f617c97c3c.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">S</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/sakana-p85.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/sakana-p86.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/sakura-p87.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/sakura-p88.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/sakura-p89.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/sakura-p90.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/sen-p91.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/sen-p92.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/slim-p93.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/slim-p94.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/stylus-p95.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/stylus-p96.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/styx-p97.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/styx-p98.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_0_bde218f0-b762-4d2b-9427-1a34758b4386.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">T</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ta-30t-p99.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ta-30t-p100.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ta-p101.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ta-p102.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ta-long-p103.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ta-long-p104.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ta-noir-p105.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ta-noir-p106.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ta-noir-p107.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ta-noir-p108.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/tochigi-p109.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/tochigi-p110.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_0_61e0675a-4ea0-4c48-b851-8e2d06066a01.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">Y</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yc-p111.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yc-p112.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yce-p113.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yce-p114.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yh-p115.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yh-p116.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yh27t-p117.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yh27t-p118.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yhb165-p119.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yhb165-p120.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yk-damas-p121.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yk-damas-p122.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ykc-damas-p123.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ykc-damas-p124.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yl-kokaji-p125.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yl-kokaji-p126.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yls-p127.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yls-p128.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ym-damas-p129.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ym-damas-p130.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ym383l-p131.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ym383l-p132.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yms-p133.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/yms-p134.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ywb-kokaji-p135.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/ywb-kokaji-p136.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_0_36401b34-289f-4b21-a5a2-d4980abafadf.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front cover">
      <h1 style="border-radius: 500px; border: 2px solid white; padding: 2px 10px; margin: 2px; width: 42px; background: black;">Z</h1>
    </div>
    <div class="back">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/zeta-p137.png" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/guide-technique/zeta-p138.png" alt="Img 1">
    </div>

    <div class="back">
      <p style="padding: 0 20px;"><b>Publicité géoclocalisée :</b> La publicité géoclocalisée permet aux annonceurs de cibler leurs annonces en fonction de la localisation des utilisateurs. Ils peuvent ainsi diffuser leurs annonces aux utilisateurs qui se trouvent dans les villes où ils souhaitent développer leur activité.</p>
      <p style="padding: 0 20px;"><center><img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/ccd-magazine.png" style="width: 80%; margin: 0px; padding: 0 20px; height: auto;" alt="Img 4"></center></p>
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.ciseaux-coiffure-diffusion.fr/cocoonsat-ccd/sat/data/medias/cocoon-sat-magazine-ccd.png" alt="Img 1">
    </div>
    <div class="back">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_2_55b99f59-8ee3-403c-adc2-105aa3c2736a.jpg" alt="Img 1">
    </div>
  </div>

  <div class="page">
    <div class="front">
      <img src="https://www.site.ciseaux-coiffure-diffusion.ovh/data/medias/theme/lp6/collection/bg-collection-21/leonardo_diffusion_xl_colorful_tones_cracked_paint_dripping_te_0_0c2de246-66ec-4bfc-b93c-475cd8cc41d2.jpg" alt="Img 5">
    </div>
    <div class="back cover">
      <h3>C'est tout, pour l'instant...</h3>
      <p>Magazine code et contenu :<br><a href="https://www.mowxml.org/" target="_blank" rel="nofollow">MOWXML.ORG</a>
      <br>Idée originale :<br><a href="https://www.ciseaux-coiffure-diffusion.fr/" target="_blank" rel="nofollow">CISEAUX COIFFURE DIFFUSION</a>
      <br>Images par : CCD</p>
    </div>
  </div>
</div>


  <script>
const flipBook = (elBook) => {
  elBook.style.setProperty("--c", 0); // Set current page
  elBook.querySelectorAll(".page").forEach((page, idx) => {
    page.style.setProperty("--i", idx);
    page.addEventListener("click", (evt) => {
      if (evt.target.closest("a")) return;
      const curr = evt.target.closest(".back") ? idx : idx + 1;
      elBook.style.setProperty("--c", curr);
    });
  });
};

document.querySelectorAll(".book").forEach(flipBook);
  </script>

  <script>
const menuLinks = document.querySelectorAll(".menu-link");

menuLinks.forEach((link) => {
	link.addEventListener("click", () => {
		menuLinks.forEach((link) => {
			link.classList.remove("is-active");
		});
		link.classList.add("is-active");
	});
});

  </script>

  <script>
var c = document.getElementById('canv');
var $ = c.getContext('2d');
var u = 0;

var go = function() {
  var sc, g, g1, i, j, p, x, y, z, w, a, cur,
    d = new Date() / 1000,
    rnd = shift(),
    rnd1 = d,
    rnd2 = 2.4,
    rnd3 = d * 0.2,
    rnd1c = Math.cos(rnd1),
    rnd1s = Math.sin(rnd1),
    rnd2c = Math.cos(rnd2),
    rnd2s = Math.sin(rnd2);

  c.width = window.innerWidth;
  c.height = window.innerHeight;
  sc = Math.max(c.width, c.height);
  $.translate(c.width * 0.5, c.height * 0.5);
  $.scale(sc, sc);
  g = $.createLinearGradient(-1, -2, 1, 2);
  g.addColorStop(0.0, 'hsla(338, 95%, 25%, 1)');
  g.addColorStop(0.5, 'hsla(260, 95%, 5%, 1)');
  g.addColorStop(1.0, 'hsla(338, 95%, 30%, 1)');
  $.fillStyle = g;
  $.fillRect(-0.5, -0.5, 1, 1);
  $.globalCompositeOperation = 'lighter';
  $.rotate(rnd3 % Math.PI * 2);
  for (i = 0; i < 300; i += 1) {
    p = rnd();
    x = (p & 0xff) / 128 - 1;
    y = (p >>> 8 & 0xff) / 128 - 1;
    z = (p >>> 16 & 0xff) / 128 - 1;
    w = (p >>> 24 & 0xff) / 256;
    z += d * 0.5;
    z = (z + 1) % 2 - 1;
    a = (z + 1) * 0.5;
    if (a < 0.9) {
      $.globalAlpha = a / 0.7;
    }else {
      a -= 0.9;
      $.globalAlpha = 1 - a / 0.1;
    }
    cur = x * rnd1c + y * rnd1s;
    y = x * rnd1s - y * rnd1c;
    x = cur;
    cur = y * rnd2c + z * rnd2s;
    z = y * rnd2s - z * rnd2c;
    y = cur;
    z -= 0.65;
    if (z >= 0) {
      continue;
    }
    sc = 0.1 / z;
    x *= sc;
    y *= sc;
    $.save();
    g1 = $.createRadialGradient(1, 1, 2, 1, 1, 1);
    g1.addColorStop(0.0, 'hsla('+i+', 70%, 40%,.8)');
    g1.addColorStop(0.5, 'hsla('+i+', 75%, 50%, 1)');
    g1.addColorStop(1.0, 'hsla('+i+', 80%, 60%, .8)');
    $.fillStyle = g1;
    $.translate(x, y);
    $.scale(sc * 0.017, sc * 0.017);
    $.beginPath();
    $.moveTo(2, 0);
    for (j = 0; j < 10; j += 1) {
      $.rotate(Math.PI*2 * 0.1);
      $.lineTo(j % 2 + 1, 0);
    }
    $.arc(10, 10, 1, 0, Math.PI * 2);    
    $.rotate(Math.PI * 2 * 0.1);
    $.closePath();
    $.fill();
    $.restore();
  }
};
/*
Marsaglia's Xorshift128 PRG: http://en.wikipedia.org/wiki/Xorshift
*/
var shift = function(x, y, z, w) {
  x = x || 123456789;
  y = y || 362436069;
  z = z || 521288629;
  w = w || 88675123;

  return function() {
    var s = x ^ (x << 11);
    x = y;
    y = z;
    z = w;
    w = (w ^ (w >>> 19)) ^ (s ^ (s >>> 8));
    return w;
  };
}
window.addEventListener('resize', function() {
  c.width = window.innerWidth;
  c.height = window.innerHeight;
}, false);

var run = function() {
  window.requestAnimationFrame(run);
  go();
}
run();

console.log('With ❤ Always, @tmrDevelops');
  </script>


</body>
</html>