@import url('https://fonts.googleapis.com/css2?family=Charmonman:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Srisakdi&subset=latin-ext,thai,vietnamese');
@import url('https://fonts.googleapis.com/css?family=Cormorant+Upright:300&subset=latin-ext,vietnamese');
@import url('https://fonts.googleapis.com/css?family=Dancing+Script&subset=latin-ext,vietnamese');
@import url('https://fonts.googleapis.com/css?family=Great+Vibes&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Poiret+One&subset=cyrillic,latin-ext');
@import url('https://fonts.googleapis.com/css?family=Tangerine');
@import url('https://fonts.googleapis.com/css?family=Marck+Script&subset=cyrillic,latin-ext');
@import url('https://fonts.googleapis.com/css?family=Bad+Script&subset=cyrillic');
@import url('https://fonts.googleapis.com/css?family=Nixie+One');
@import url('https://fonts.googleapis.com/css?family=Pompiere');
@import url('https://fonts.googleapis.com/css?family=Alex+Brush&subset=latin-ext');	
@import url('https://fonts.googleapis.com/css?family=Rochester');
@import url('https://fonts.googleapis.com/css?family=Petit+Formal+Script&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Gruppo&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Wire+One');
@import url('https://fonts.googleapis.com/css?family=Athiti:200&subset=latin-ext,thai,vietnamese');
@import url('https://fonts.googleapis.com/css2?family=Parisienne&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Chathura:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap');

/* Les fonts de google a garder ici  */

.charmonman-regular {font-family: "Charmonman", cursive; font-weight: 400;font-style: normal;}
.charmonman-bold {font-family: "Charmonman", cursive;font-weight: 700; font-style: normal;}
.font-srisakdi {font-family: 'Srisakdi', cursive;}    
.font-cormorant {font-family: 'Cormorant Upright', serif;} 
.font-dancing {font-family: 'Dancing Script', cursive;}
.font-great {font-family: 'Great Vibes', cursive;}
.font_poiret {font-family: 'Poiret One', cursive;}
.font-tangerine {font-family: 'Tangerine', cursive;}
.font-marck {font-family: 'Marck Script', cursive;}
.font-bad {font-family: 'Bad Script', cursive;}
.font-nixie {font-family: 'Nixie One', cursive;}
.font-pompiere {font-family: 'Pompiere', cursive;}
.font-alex {font-family: 'Alex Brush', cursive;}
.font-rochester {font-family: 'Rochester', cursive;}
.font-petitformal {font-family: 'Petit Formal Script', cursive;}
.font-gruppo {font-family: 'Gruppo', cursive;}
.font-WireOne {font-family: 'Wire One', sans-serif;}
.font-athiti {font-family: 'Athiti', sans-serif;}
.font-Parisienne {font-family: 'Parisienne', cursive;}
.font-chathura {font-family: 'Chathura', sans-serif;}
.font-Montserrat-100-200-300-400-500 {font-family: 'Montserrat', sans-serif;}
.font-Quicksand-300-400-500 {font-family: 'Quicksand', sans-serif;}


  /* Jolli effet sur image au passage de la souris */
.hover15 figure {
	position: relative;	
}
.hover15 figure::before {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	display: block;
	content: '';
	width: 0;
	height: 0;
	background: rgba(255,255,255,.2);
	border-radius: 100%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	opacity: 0;
}
.hover15 figure:hover::before {
	-webkit-animation: circle .75s;
	animation: circle .75s;
}
@-webkit-keyframes circle {
	0% {
		opacity: 1;
	}
	40% {
		opacity: 1;
	}
	100% {
		width: 200%;
		height: 200%;
		opacity: 0;
	}
}
@keyframes circle {
	0% {
		opacity: 1;
	}
	40% {
		opacity: 1;
	}
	100% {
		width: 200%;
		height: 200%;
		opacity: 0;
	}
}

/* mettre caractere en gras et rouge */
.texteredbig {
    font-size: 20px;
	font-weight: 200;
	color: red;
	}

/* mettre sur une seule ligne plusieurs éléments */
.float-inline {
    display: inline-block;
    width: 100%;
    #height: 75px;
    #margin: 10px;
   
}

/* espace entre des éléments*/
 .espace {
	 padding-right: 3px;
	 }
/* bouton fond vert pour le menu utilisateurs */
.button-utilisateur {
    ##background-color: #2e71f0; 
    border: none;
    ##color: #042771;
	color: green;
    padding: 10px 8px;
	border-radius: 3px;
	transition: all 0.5s;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    cursor: pointer;
    float: left;
	margin: 0px 4px;/* espace haut et côtés entre les boutons */
}
.button-utilisateur:hover {
    background-color: #006a00;
	color: white;
	##border: 1px solid white;
}
	 
/* bouton couleur orange */
.button-orange {
    background-color: #f38200; 
    border: none;
    color: white;
    padding: 0px 8px;
	border-radius: 4px;
	transition: all 0.5s;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    cursor: pointer;
    float: left;
	margin: 0px 4px;/* espace haut et côtés entre les boutons */
}
.button-orange:hover {
    background-color: #ff9c2a;
	border: 1px solid white;
}

/* bouton couleur bleu */
.button-bleu {
    background-color: #142958; 
    border: none;
    color: white;
    padding: 0px 8px;
	border-radius: 4px;
	transition: all 0.5s;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    cursor: pointer;
    float: left;
	margin: 0px 4px;/* espace haut et côtés entre les boutons */
}
.button-bleu:hover {
    background-color: #3766a9;
	border: 1px solid white;
}

/* bouton couleur blanc */
.button-blanc {
    background-color: #ffffff;
    ##border: blue;
    ##color: #1a3867;
    padding: 1px 8px;
	border-radius: 4px;
	transition: all 0.5s;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 13px;
    cursor: pointer;
    ##margin-top:5px;
	border: 1px solid #9a9a9a;
	##background-image: linear-gradient(to bottom, #ffffff, #e2e2e2);
}
.button-blanc:hover {
    ##background-color: #5694ec;
	##border: 1px solid white;
	color: #000000; 
	box-shadow: inset 0 1px 0 rgb(167 167 167 / 20%), 0 1px 1px rgb(111 109 109);
	background-image: linear-gradient(to bottom, #ffffff, #cacaca);
}


/* bouton couleur vert foncé spécial bannières */
.button-dark {
    background-color:  #073a19; 
    border: none;
    color: white;
    padding: 0px 8px;
	border-radius: 4px;
	transition: all 0.5s;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
    ##float: center;
	margin: 0px 4px;/* espace haut et côtés entre les boutons */
}
.button-dark:hover {
    background-color:  #073a19;
	border: 1px solid white;
	color: white; 
}
	
/* bouton couleur noir */
.button-black {
    background-color: black; 
    border: none;
    color: white;
    padding: 0px 8px;
	border-radius: 4px;
	transition: all 0.5s;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    cursor: pointer;
    float: center;
	margin: 0px 4px;/* espace haut et côtés entre les boutons */
}
.button-black:hover {
    background-color: black;
	border: 1px solid white;
	color: white; 
}	
	
/* bouton droite couleur vert avec flèches (Connection) */
.button-green-R {
    background-color: #1d2924; 
    color: white; 
    border: none;
    border-radius: 4px;
	transition: all 0.5s;
    cursor: pointer;
    margin: 5px;
	width: 430px;	/* règler la largeur ici */
	padding: 0px 5px;
	text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 15px;
    font-weight: normal;
    #-webkit-transition-duration: 0.4s; /* Safari */
    #transition-duration: 0.4s;
    float: right;
	margin-top: 9px;
}	
.button-green-R :hover {
    background-color: #1c2b28;
	##box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
}
.button-green-R  span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}
.button-green-R  span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -10px;
  transition: 0.5s;
}
.button-green-R :hover span {
  padding-right: 10px;
}
.button-green-R :hover span:after {
  opacity: 1;
  right: 0;
}

/* bouton gauche couleur vert avec flèches (Placez une annonce, Connectez-vous) */
.button-green-L {
    background-color: #233e38; 
    color: white; 
    border: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px; 
	box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
	transition: all 0.5s;
    cursor: pointer;
    margin: 5px;
	width: 300px;	/* règler la largeur ici */
	padding: 0px 5px;
	text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
	#font-weight: lighther;
    #-webkit-transition-duration: 0.4s; /* Safari */
    #transition-duration: 0.4s;
    float: left;
	margin-top: 9px;
}	
.button-green-L :hover {
    background-color: tranparent;
}
.button-green-L  span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}
.button-green-L  span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -10px;
  transition: 0.5s;
}
.button-green-L :hover span {
  padding-right: 10px;
}
.button-green-L :hover span:after {
  opacity: 1;
  right: 0;
}

/*aligher un élément à droite*/
.right {
    float: right;
}
/*aligher un élément à gauche*/
.left {
    float: left;
}

/* Texte défile horizontal (délai de plus de 2 minutes entre les passages */

.marquee {
  margin: 0 auto;
  white-space: nowrap;
  overflow: hidden;
  position: absolute;
}

.marquee span {
  display: inline-block;
  padding-left: 100%;
  animation: marquee 150s linear infinite;
}

.marquee2 span {
  animation-delay: 150s;
}

@keyframes marquee {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(-100%, 0);
  }
}
 
/* Texte défile manuellement à l'aide du curseur horizontal */
.text-defile {<!--  w w  w. j a  v a2s.  c  om-->
  width: 500px;
  height: 100px;
  white-space: nowrap;
  overflow-x: auto;
}


/* Texte défilant */
.defile {
	display:block;
	width: 1140px;
	overflow: hidden;    /*  masque le décalage */
    white-space: nowrap; /* force sur une même ligne */
	margin: 0 auto;
    font-family:Cursive;
	font-size:10pt;
	color:#6f6a67;
	font-style:italic;
    -webkit-animation:linear marqueelike 80s infinite ;
	-moz-animation:linear marqueelike 80s infinite ;
	-o-animation:linear marqueelike 80s infinite ;
	-ms-animation:linear marqueelike 80s infinite ;
	animation:linear marqueelike 80s infinite ;
}
/* arrêt sur mouseover */
.defile:hover {
    -webkit-animation-play-state: paused;
    -moz-animation-animation-play-state: paused;
    -o-animation-animation-play-state: paused;    
	-ms-animation-play-state: paused; 
	 animation-play-state: paused;
}
/* Make it move */

@-webkit-keyframes marqueelike{
    0% { text-indent:  90em;  /* tout à droite */  }
100% { text-indent:  -119em;  /* tout à gauche */  } }
@-moz-keyframes marqueelike {
	0% { text-indent:  90em;  /* tout à droite */  }
100% { text-indent: -119em;   /* tout à gauche */ } }
@-o-keyframes marqueelike {
	0% { text-indent:  90em;  /* tout à droite */  }
100% { text-indent: -119em;   /* tout à gauche */ } }
@-ms-keyframes marqueelike {
	0% { text-indent:  90em;  /* tout à droite */  }
100% { text-indent: -119em;   /* tout à gauche */ } }
@keyframes marqueelike {
	0% { text-indent:  90em;  /* tout à droite */  }
  100% { text-indent: -119em;   /* tout à gauche */ }  }
  
/*bord cadre images*/
.bord {border: double 4px #6c8386;}
.bord1 {border: 4px ridge #80909C;}
/*bords arrondis de rectangle*/
.arrondi-haut {
	border-radius: 8px 8px 0px 0px;
    -moz-border-radius: 8px 8px 0px 0px;
    -webkit-border-radius: 8px 8px 0px 0px;
	-khtml-border-radius: 8px 8px 0px 0px;
	-o-border-radius: 8px 8px 0px 0px;
	-ms-border-radius: 8px 8px 0px 0px;
	border: 0px solid #000000; /*encadrement*/
	behavior: url(/templates/pie/PIE.htc);}

/* Texte qui clignote */
@-webkit-keyframes flash {
0%, 50%, 100% {opacity: 1;}
25%, 75% {opacity: 0;}
}
@-moz-keyframes flash {
0%, 50%, 100% {opacity: 1;}
25%, 75% {opacity: 0;}
}
@-ms-keyframes flash {
0%, 50%, 100% {opacity: 1;}
25%, 75% {opacity: 0;}
}
@-o-keyframes flash {
0%, 50%, 100% {opacity: 1;}
25%, 75% {opacity: 0;}
}
@keyframes flash {
0%, 50%, 100% {opacity: 1;}
25%, 75% {opacity: 0;}
}
.clignote {
-webkit-animation: flash 1s infinite;
-moz-animation: flash 1s infinite;
-ms-animation: flash 1s infinite;
-o-animation: flash 1s infinite;
animation: flash 1s infinite;
}


/*Petit Zoom simple  utilisé sur toutes les photos de spa*/
.zoom { 
   width: auto; padding: 5px; border: 0px solid black; 
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
}
.zoom:hover {
   -moz-transform: scale(1.1);
   -webkit-transform: scale(1.1);
   -o-transform: scale(1.1);
   transform: scale(1.1);
   -ms-transform: scale(1.1);
filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand',
   M11=2, M12=-0, M21=0, M22=2);
   -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.5);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.5);
     box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.5);
   }
/*Menu qui se décroche à 5 ° installé sur le shopping cart */
.le-menu-item {
position: relative;
display: inline-block;
::border: 1px dashed #000;
padding: 1px;
background: #f0f0f0;
height: auto;
opacity: 0.7;
filter:alpha(opacity=70);/* For IE8 and earlier */
text-decoration: none;
width: 80%;
/* Firefox */
-moz-transition: all 1s ease;
/* WebKit */
-webkit-transition: all 1s ease;
/* Opera */
-o-transition: all 1s ease;
/* Standard */
}
.le-menu-item:hover {
opacity: 1;                                                                          
filter:alpha(opacity=100); /*   For IE8 and earlier */
/* Firefox */
-moz-transform: scale(1.5) rotate(5deg) translate(5px);
/* WebKit */
-webkit-transform: scale(0.9) rotate(5deg) translate(5px);
/* Opera */
-o-transform: scale(1.5) rotate(5deg) translate(5px);
/* Standard */
transform: scale(1.5) rotate(5deg) translate(5px);
z-index: 1000;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.82);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.82);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.82);	
}

/* ROTATION ZOOM EN CSS  - Le fichier class est : ex_zoom  (fonctionne):*/
.ex_zoom {
    position: relative; width: auto; margin: auto;  display: block;
    color: black; text-decoration: none; 
       
   -webkit-transition: .5s all ease-in-out;
   -moz-transition: .5s all ease-in-out;
   -o-transition: .5s all ease-in-out;
   transition: .5s all ease-in-out;
}
.ex_zoom:hover {
    padding: 1px; background: grey;
   -webkit-transform: rotate(355deg) scale(1.5);
   -moz-transform: rotate(355deg) scale(1.5);
   -o-transform: rotate(355deg) scale(1.5);
   transform: rotate(355deg) scale(1.5);
   box-shadow: 2px 2px 5px #000;
   -webkit-box-shadow: 2px 2px 5px #000;
}
/* fait pivoter horizontalement un image seul (fonctionne) ---*/
.rotate{
    -webkit-transition-duration: 1.8s;
    -moz-transition-duration: 1.8s;
    -o-transition-duration: 1.8s;
    transition-duration: 1.8s;
   -ms-transition-duration: 1.8s;         
     transition-duration: 1.8s;
    -webkit-transition-property: -webkit-transform;  // Chrome Safari
    -moz-transition-property: -moz-transform;  // Mozilla
    -o-transition-property: -o-transform;   // Opéra
    transition-property: transform;
    -ms-transition-property:-ms-transform;         // IE
    transition-property:transform;
     overflow:hidden;
     }     
.rotate:hover   { 

    -webkit-transform:rotateY(180deg);
    -moz-transform:rotateY(180deg); 
    -o-transform:rotateY(180deg);
   -ms-transform:rotateY(180deg); 
     transform:rotateY(180deg);
}   
.images{  
    position: absolute;
    top: auto;
    left: auto;
    width: auto;
    height: auto;
    margin:0px 0 0 0px;
    -webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); }}

/* OMBRE SOUS IMAGE (fonctionne) ---*/
.ombre{
    -webkit-box-shadow: 1px 1px 4px 0px rgba(161,161,161,0.94);
    -moz-box-shadow: 1px 1px 4px 0px rgba(161,161,161,0.94);
    box-shadow: 1px 1px 4px 0px rgba(161,161,161,0.94);
}
.ombre1{
    -webkit-box-shadow: 2px 2px 7px 2px rgba(166,166,166,1);
    -moz-box-shadow: 2px 2px 7px 2px rgba(166,166,166,1);
    box-shadow: 2px 2px 7px 2px rgba(166,166,166,1);	
	}
.ombre2{
    -webkit-box-shadow: 3px 3px 9px 3px rgba(135,135,135,1);
    -moz-box-shadow: 3px 3px 9px 3px rgba(135,135,135,1);
    box-shadow: 3px 3px 9px 3px rgba(135,135,135,1);
	}
.ombre3{
    -webkit-box-shadow: 5px 5px 11px 2px rgba(138,138,138,0.9);
    -moz-box-shadow: 5px 5px 11px 2px rgba(138,138,138,0.9);
    box-shadow: 5px 5px 11px 2px rgba(138,138,138,0.9);
	}	
/* fait tourner une image sur elle même --- fonctionne) */
.rota{  
    position: absolute;
    top: auto;
    left: auto;
    width: auto;
    height: auto;
    margin:0px 0 0 0px;
    -webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); }}


/* Rotation qui s’inverse au passage de la souris :  :*/
.spiralContainer {
  border-radius: 50%;
  width:200px;
  height:200px;
  overflow:hidden;
  margin:20px;

  -webkit-animation: spin 3s linear 0s infinite reverse;
  -moz-animation: spin 3s linear 0s infinite reverse;  
  -ms-animation: spin 3s linear 0s infinite reverse;
  -o-animation: spin 3s linear 0s infinite reverse;
  animation: spin 3s linear 0s infinite reverse;
  
  -webkit-animation-play-state: paused;
  -moz-animation-play-state: paused;
  -ms-animation-play-state: paused;
  -o-animation-play-state: paused;  
  animation-play-state: paused;
}
.spiral { /* utilisé pour le logo de chantal :*/
  width:30px;
  height:30px;
  border-radius: 50%;
  background-image: url(/templates/purity_iii/images/logo-spiral28px.png);
  ::background-repeat:no-repeat;
  background-position:50% 50%;
  font-size: 1px;
  margin-top: 10px; 
  -webkit-animation: spin 10s linear 0s infinite normal;
  -moz-animation: spin 10s linear 0s infinite normal;
  -ms-animation: spin 10s linear 0s infinite normal;
  -o-animation: spin 10s linear 0s infinite normal;
  animation: spin 10s linear 0s infinite normal;
}
.spiralContainer:hover {
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -ms-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running;
}
@keyframes spin {
  0% { transform: rotate(-360deg); }
  100% { transform: rotate(0deg); }
}
@-webkit-keyframes spin {
  0% {-webkit-transform: rotate(-360deg); }
  100% { -webkit-transform: rotate(0deg); }
}
@-ms-keyframes spin {
  0% {-ms-transform: rotate(-360deg); }
  100% { -ms-transform: rotate(0deg); }
}
@-moz-keyframes spin {
  0% { -moz-transform: rotate(-360deg); }
  100% { -moz-transform: rotate(0deg); }
}
@-o-keyframes spin {
  0% { -o-transform: rotate(-360deg); }
  100% { -o-transform: rotate(0deg); }
}

/* EFFETS D'ECRITURE SUR LES PHOTOS  :*/
/* Site des scripts: http://epicadesign.fr/css3-des-effets-avances-de-survol-dimage/   -     site des demos : https://tympanus.net/Development/HoverEffectIdeas/  */
/* Style du CSS de base :*/
@font-face{font-weight:normal;font-style:normal;font-family:'feathericons';src:url('../fonts/feathericons/feathericons.eot?-8is7zf');src:url('../fonts/feathericons/feathericons.eot?#iefix-8is7zf') format('embedded-opentype'),url('../fonts/feathericons/feathericons.woff?-8is7zf') format('woff'),url('../fonts/feathericons/feathericons.ttf?-8is7zf') format('truetype'),url('../fonts/feathericons/feathericons.svg?-8is7zf#feathericons') format('svg')}
*, *:after, *:before {box-sizing: border-box;}
.grids{position:relative;margin:0 auto;padding:0.0em 0 0em;max-width:1000px;list-style:none;text-align:center}
.grids figure{position:relative;float:left;overflow:hidden;margin:0px 0%;min-width:265px;max-width:260px;max-height:290px;width:48%;background:#3085a3;text-align:center;cursor:pointer;
    ::box-shadow: 0px 18px 25px -6px #0f0f0f;/* Bords du cadre*/
   ::-webkit-box-shadow: 0px 18px 25px -6px #0f0f0f;
   ::-moz-box-shadow: 0px 18px 25px -6px #0f0f0f;
   ::-o-box-shadow: 0px 18px 25px -6px #0f0f0f;}
.grids figure img{position:relative;display:block;min-height:100%;max-width:100%;opacity:.8}
.grids figure figcaption{padding:0em;color:#fff;text-transform:uppercase;font-size:1.4em;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.grids figure figcaption::before,.grids figure figcaption::after{pointer-events:none}
.grids figure figcaption,.grids figure figcaption>a{position:absolute;top:0;left:0;width:100%;height:100%;::::border:4px ridge #CCC;
::::border: 1px solid #fff;/* Bords du cadre*/
}
.grids figure figcaption>a{z-index:1000;text-indent:200%;white-space:nowrap;font-size:0;opacity:0}
.grids figure h2{word-spacing:-0.15em;font-weight:300;}
.grids figure h2 span{font-weight:800}
.grids figure h2,.grids figure p{margin:0}
.grids figure p{letter-spacing:1px;font-size:68.5%}
@media screen and (max-width:50em){
.grids figure{display:inline-block;float:none;margin:0px auto;width:100%}
}
/* Lily :*/
figure.effect-lily img{max-width:none;width:-webkit-calc(100% + 50px);width:calc(100% + 50px);opacity:.7;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-40px,0,0);transform:translate3d(-40px,0,0)}
figure.effect-lily figcaption{text-align:left}
figure.effect-lily figcaption>div{position:absolute;bottom:0;left:0;padding:2em;width:100%;height:50%}
figure.effect-lily h2,figure.effect-lily p{-webkit-transform:translate3d(0,40px,0);transform:translate3d(0,40px,0)}
figure.effect-lily h2{-webkit-transition:-webkit-transform .35s;transition:transform .35s}
figure.effect-lily p{color:rgba(255,255,255,0.8);opacity:0;-webkit-transition:opacity .2s,-webkit-transform .35s;transition:opacity .2s,transform .35s}
figure.effect-lily:hover img,figure.effect-lily:hover p{opacity:1}
figure.effect-lily:hover img,figure.effect-lily:hover h2,figure.effect-lily:hover p{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
figure.effect-lily:hover p{-webkit-transition-delay:.05s;transition-delay:.05s;-webkit-transition-duration:.35s;transition-duration:.35s}

/* Sadie :*/
figure.effect-sadie figcaption::before{position:absolute;top:0;left:0;width:100%;height:100%;background:-webkit-linear-gradient(top,rgba(72,76,97,0) 0,rgba(72,76,97,0.8) 75%);background:linear-gradient(to bottom,rgba(72,76,97,0) 0,rgba(72,76,97,0.8) 75%);content:'';opacity:0;-webkit-transform:translate3d(0,50%,0);transform:translate3d(0,50%,0)}
 figure.effect-sadie h2{position:absolute;top:50%;left:0;width:100%;color:#484c61;-webkit-transition:-webkit-transform .35s,color .35s;transition:transform .35s,color .35s;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}
 figure.effect-sadie figcaption::before,figure.effect-sadie p{-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-sadie p{position:absolute;bottom:0;left:0;padding:2em;width:100%;opacity:0;-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}
 figure.effect-sadie:hover h2{color:#fff;-webkit-transform:translate3d(0,-50%,0) translate3d(0,-40px,0);transform:translate3d(0,-50%,0) translate3d(0,-40px,0)}
 figure.effect-sadie:hover figcaption::before,figure.effect-sadie:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Honey :*/
 figure.effect-honey{background:#4a3753}
 figure.effect-honey img{opacity:.9;-webkit-transition:opacity .35s;transition:opacity .35s}
 figure.effect-honey:hover img{opacity:.5}
 figure.effect-honey figcaption::before{position:absolute;bottom:0;left:0;width:100%;height:10px;background:#fff;content:'';-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}
 figure.effect-honey h2{position:absolute;bottom:0;left:0;padding:1em 1.5em;width:100%;text-align:left;-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}
 figure.effect-honey h2 i{font-style:normal;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}
 figure.effect-honey figcaption::before,figure.effect-honey h2{-webkit-transition:-webkit-transform .35s;transition:transform .35s}
 figure.effect-honey:hover figcaption::before,figure.effect-honey:hover h2,figure.effect-honey:hover h2 i{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Layla :*/
 figure.effect-layla{background:#18a367}
 figure.effect-layla img{height:390px}
 figure.effect-layla figcaption{padding:3em}
 figure.effect-layla figcaption::before,figure.effect-layla figcaption::after{position:absolute;content:'';opacity:0}
 figure.effect-layla figcaption::before{top:50px;right:30px;bottom:50px;left:30px;border-top:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:scale(0,1);transform:scale(0,1);-webkit-transform-origin:0 0;transform-origin:0 0}
 figure.effect-layla figcaption::after{top:30px;right:50px;bottom:30px;left:50px;border-right:1px solid #fff;border-left:1px solid #fff;-webkit-transform:scale(1,0);transform:scale(1,0);-webkit-transform-origin:100% 0;transform-origin:100% 0}
 figure.effect-layla h2{padding-top:26%;-webkit-transition:-webkit-transform .35s;transition:transform .35s}
 figure.effect-layla p{padding:.5em 2em;text-transform:none;opacity:0;-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}
 figure.effect-layla img,figure.effect-layla h2{-webkit-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}
 figure.effect-layla img,figure.effect-layla figcaption::before,figure.effect-layla figcaption::after,figure.effect-layla p{-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-layla:hover img{opacity:.7;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-layla:hover figcaption::before,figure.effect-layla:hover figcaption::after{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
 figure.effect-layla:hover h2,figure.effect-layla:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-layla:hover figcaption::after,figure.effect-layla:hover h2,figure.effect-layla:hover p,figure.effect-layla:hover img{-webkit-transition-delay:.15s;transition-delay:.15s}
 
 /* Zoe :*/
 figure.effect-zoe figcaption{top:auto;bottom:0;padding:1em;height:3.75em;background:#fff;color:#3c4a50;-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}
 figure.effect-zoe h2{float:left}
 figure.effect-zoe p.icon-links a{float:right;color:#3c4a50;font-size:1.4em}
 figure.effect-zoe:hover p.icon-links a:hover,figure.effect-zoe:hover p.icon-links a:focus{color:#252d31}
 figure.effect-zoe p.description{position:absolute;bottom:8em;padding:2em;color:#fff;text-transform:none;font-size:90%;opacity:0;-webkit-backface-visibility:hidden;-webkit-transition:opacity .35s;transition:opacity .35s;-webkit-backface-visibility:hidden}
 figure.effect-zoe h2,figure.effect-zoe p.icon-links a{-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,200%,0);transform:translate3d(0,200%,0)}
 figure.effect-zoe p.icon-links a span::before{display:inline-block;padding:8px 10px;font-family:'feathericons';speak:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
 .icon-eye::before{content:'\e000'}
 .icon-paper-clip::before{content:'\e001'}
 .icon-heart::before{content:'\e024'}
 figure.effect-zoe h2{display:inline-block}
 figure.effect-zoe:hover p.description{opacity:1}
 figure.effect-zoe:hover figcaption,figure.effect-zoe:hover h2,figure.effect-zoe:hover p.icon-links a{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-zoe:hover h2{-webkit-transition-delay:.05s;transition-delay:.05s}
 figure.effect-zoe:hover p.icon-links a:nth-child(3){-webkit-transition-delay:.1s;transition-delay:.1s}
 figure.effect-zoe:hover p.icon-links a:nth-child(2){-webkit-transition-delay:.15s;transition-delay:.15s}
 figure.effect-zoe:hover p.icon-links a:first-child{-webkit-transition-delay:.2s;transition-delay:.2s}
 
 /* Oscar :*/
 figure.effect-oscar{background:-webkit-linear-gradient(45deg,#22682a 0,#9b4a1b 40%,#3a342a 100%);background:linear-gradient(45deg,#22682a 0,#9b4a1b 40%,#3a342a 100%)}
figure.effect-oscar img{opacity:.9;-webkit-transition:opacity .35s;transition:opacity .35s}
figure.effect-oscar figcaption{padding:3em;background-color:rgba(58,52,42,0.7);-webkit-transition:background-color .35s;transition:background-color .35s}
figure.effect-oscar figcaption::before{position:absolute;top:30px;right:30px;bottom:30px;left:30px;border:1px solid #fff;content:''}
figure.effect-oscar h2{margin:20% 0 10px 0;-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}
figure.effect-oscar figcaption::before,figure.effect-oscar p{opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:scale(0);transform:scale(0)}
figure.effect-oscar:hover h2{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
figure.effect-oscar:hover figcaption::before,figure.effect-oscar:hover p{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
figure.effect-oscar:hover figcaption{background-color:rgba(58,52,42,0)}
figure.effect-oscar:hover img{opacity:.4}

/* Marley :*/
figure.effect-marley figcaption{text-align:right}
 figure.effect-marley h2,figure.effect-marley p{position:absolute;right:30px;left:30px;padding:10px 0}
 figure.effect-marley p{bottom:30px;line-height:1.5;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}
 figure.effect-marley h2{top:30px;-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}
 figure.effect-marley:hover h2{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-marley h2::after{position:absolute;top:100%;left:0;width:100%;height:4px;background:#fff;content:'';-webkit-transform:translate3d(0,40px,0);transform:translate3d(0,40px,0)}
 figure.effect-marley h2::after,figure.effect-marley p{opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-marley:hover h2::after,figure.effect-marley:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Ruby :*/
 figure.effect-ruby{background-color:#17819c}
 figure.effect-ruby img{opacity:.7;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:scale(1.15);transform:scale(1.15)}
 figure.effect-ruby:hover img{opacity:.5;-webkit-transform:scale(1);transform:scale(1)}
 figure.effect-ruby h2{margin-top:20%;-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}
 figure.effect-ruby p{margin:1em 0 0;padding:3em;border:1px solid #fff;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(0,20px,0) scale(1.1);transform:translate3d(0,20px,0) scale(1.1)}
 figure.effect-ruby:hover h2{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-ruby:hover p{opacity:1;-webkit-transform:translate3d(0,0,0) scale(1);transform:translate3d(0,0,0) scale(1)}
 
 /* Roxy :*/
 figure.effect-roxy{background:-webkit-linear-gradient(45deg,#ff89e9 0,#05abe0 100%);background:linear-gradient(45deg,#ff89e9 0,#05abe0 100%)}
 figure.effect-roxy img{max-width:none;width:-webkit-calc(100% + 60px);width:calc(100% + 60px);-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-50px,0,0);transform:translate3d(-50px,0,0)}
 figure.effect-roxy figcaption::before{position:absolute;top:30px;right:30px;bottom:30px;left:30px;border:1px solid #fff;content:'';opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-20px,0,0);transform:translate3d(-20px,0,0)}
 figure.effect-roxy figcaption{padding:3em;text-align:left}
 figure.effect-roxy h2{padding:30% 0 10px 0}
 figure.effect-roxy p{opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}
 figure.effect-roxy:hover img{opacity:.7;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-roxy:hover figcaption::before,figure.effect-roxy:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Bubba :*/
 figure.effect-bubba{background:#9e5406}
 figure.effect-bubba img{opacity:.7;-webkit-transition:opacity .35s;transition:opacity .35s}
 figure.effect-bubba:hover img{opacity:.4}
 figure.effect-bubba figcaption::before,figure.effect-bubba figcaption::after{position:absolute;top:30px;right:30px;bottom:30px;left:30px;content:'';opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-bubba figcaption::before{border-top:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:scale(0,1);transform:scale(0,1)}
 figure.effect-bubba figcaption::after{border-right:1px solid #fff;border-left:1px solid #fff;-webkit-transform:scale(1,0);transform:scale(1,0)}
 figure.effect-bubba h2{padding-top:30%;-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,-20px,0);transform:translate3d(0,-20px,0)}
 figure.effect-bubba p{padding:20px 2.5em;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}
 figure.effect-bubba:hover figcaption::before,figure.effect-bubba:hover figcaption::after{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
 figure.effect-bubba:hover h2,figure.effect-bubba:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Romeo :*/
 figure.effect-romeo img{-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:scale3d(1.4,1.4,1);transform:scale3d(1.4,1.4,1)}
 figure.effect-romeo:hover img{opacity:.6;-webkit-transform:scale3d(1,1,1);transform:translate3d(1,1,1)}
 figure.effect-romeo figcaption::before,figure.effect-romeo figcaption::after{position:absolute;top:50%;left:50%;width:80%;height:1px;background:#fff;content:'';-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}
 figure.effect-romeo:hover figcaption::before{opacity:.5;-webkit-transform:translate3d(-50%,-50%,0) rotate(45deg);transform:translate3d(-50%,-50%,0) rotate(45deg)}
 figure.effect-romeo:hover figcaption::after{opacity:.5;-webkit-transform:translate3d(-50%,-50%,0) rotate(-45deg);transform:translate3d(-50%,-50%,0) rotate(-45deg)}
 figure.effect-romeo h2,figure.effect-romeo p{position:absolute;top:50%;left:0;width:100%;-webkit-transition:-webkit-transform .35s;transition:transform .35s}
 figure.effect-romeo h2{-webkit-transform:translate3d(0,-50%,0) translate3d(0,-150%,0);transform:translate3d(0,-50%,0) translate3d(0,-150%,0)}
 figure.effect-romeo p{padding:.25em 2em;-webkit-transform:translate3d(0,-50%,0) translate3d(0,150%,0);transform:translate3d(0,-50%,0) translate3d(0,150%,0)}
 figure.effect-romeo:hover h2{-webkit-transform:translate3d(0,-50%,0) translate3d(0,-100%,0);transform:translate3d(0,-50%,0) translate3d(0,-100%,0)}
 figure.effect-romeo:hover p{-webkit-transform:translate3d(0,-50%,0) translate3d(0,100%,0);transform:translate3d(0,-50%,0) translate3d(0,100%,0)}
 
 /* Dexter :*/
 figure.effect-dexter{background:-webkit-linear-gradient(top,rgba(37,141,200,1) 0,rgba(104,60,19,1) 100%);background:linear-gradient(to bottom,rgba(37,141,200,1) 0,rgba(104,60,19,1) 100%)}
 figure.effect-dexter img{-webkit-transition:opacity .35s;transition:opacity .35s}
 figure.effect-dexter:hover img{opacity:.4}
 figure.effect-dexter figcaption::after{position:absolute;right:30px;bottom:30px;left:30px;height:-webkit-calc(50% - 30px);height:calc(50% - 30px);border:7px solid #fff;content:'';-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}
 figure.effect-dexter:hover figcaption::after{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-dexter figcaption{padding:3em;text-align:left}
 figure.effect-dexter p{position:absolute;right:60px;bottom:60px;left:60px;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(0,-100px,0);transform:translate3d(0,-100px,0)}
 figure.effect-dexter:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Sarah :*/
 figure.effect-sarah{background:#42b078}
 figure.effect-sarah img{max-width:none;width:-webkit-calc(100%+20px);width:calc(100%+20px);-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0);-webkit-backface-visibility:hidden;backface-visibility:hidden}
 figure.effect-sarah:hover img{opacity:.4;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-sarah figcaption{text-align:left}
 figure.effect-sarah h2{position:relative;overflow:hidden;padding:.5em 0}
 figure.effect-sarah h2::after{position:absolute;bottom:0;left:0;width:100%;height:3px;background:#fff;content:'';-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}
 figure.effect-sarah:hover h2::after{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-sarah p{padding:1em 0;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}
 figure.effect-sarah:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Chico :*/
 figure.effect-chico img{-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:scale(1.12);transform:scale(1.12)}
 figure.effect-chico:hover img{opacity:.5;-webkit-transform:scale(1);transform:scale(1)}
 figure.effect-chico figcaption{padding:3em}
 figure.effect-chico figcaption::before{position:absolute;top:30px;right:30px;bottom:30px;left:30px;border:1px solid #fff;content:'';-webkit-transform:scale(1.1);transform:scale(1.1)}
 figure.effect-chico figcaption::before,figure.effect-chico p{opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-chico h2{padding:20% 0 20px 0}
 figure.effect-chico p{margin:0 auto;max-width:200px;-webkit-transform:scale(1.5);transform:scale(1.5)}
 figure.effect-chico:hover figcaption::before,figure.effect-chico:hover p{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
 
 /* Milo :*/
 figure.effect-milo{background:#3d3c3c}
 figure.effect-milo img{max-width:none;width:-webkit-calc(100%+60px);width:calc(100%+60px);opacity:1;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(0px,0,0) scale(1);transform:translate3d(0px,0,0) scale(1);-webkit-backface-visibility:hidden;backface-visibility:hidden}
 figure.effect-milo:hover img{opacity:.5;-webkit-transform:translate3d(0,0,0) scale(1.02);transform:translate3d(0,0,0) scale(1.02)}
 figure.effect-milo h2{position:absolute;right:0;bottom:0;padding:1em 1.2em;:::::::color:#dbca93; /* Texte large couleur or*/}
 figure.effect-milo p{padding:0 10px 0 0;width:50%;border-right:1px solid #fff;text-align:right;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-40px,0,0);transform:translate3d(-40px,0,0)}
 figure.effect-milo:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Julia :*/
 figure.effect-julia{background:#2f3238}
 figure.effect-julia img{max-width:none;height:400px;-webkit-transition:opacity 1s,-webkit-transform 1s;transition:opacity 1s,transform 1s;-webkit-backface-visibility:hidden;backface-visibility:hidden}
 figure.effect-julia figcaption{text-align:left}
 figure.effect-julia h2{position:relative;padding:.5em 0}
 figure.effect-julia p{display:inline-block;margin:0 0 .25em;padding:.4em 1em;background:rgba(255,255,255,0.9);color:#2f3238;text-transform:none;font-weight:500;font-size:75%;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-360px,0,0);transform:translate3d(-360px,0,0)}
 figure.effect-julia p:first-child{-webkit-transition-delay:.15s;transition-delay:.15s}
 figure.effect-julia p:nth-of-type(2){-webkit-transition-delay:.1s;transition-delay:.1s}
 figure.effect-julia p:nth-of-type(3){-webkit-transition-delay:.05s;transition-delay:.05s}
 figure.effect-julia:hover p:first-child{-webkit-transition-delay:0;transition-delay:0}
 figure.effect-julia:hover p:nth-of-type(2){-webkit-transition-delay:.05s;transition-delay:.05s}
 figure.effect-julia:hover p:nth-of-type(3){-webkit-transition-delay:.1s;transition-delay:.1s}
 figure.effect-julia:hover img{opacity:.4;-webkit-transform:scale3d(1.1,1.1,1);transform:scale3d(1.1,1.1,1)}
 figure.effect-julia:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Goliath :*/
 figure.effect-goliath{background:#df4e4e}
 figure.effect-goliath img,figure.effect-goliath h2{-webkit-transition:-webkit-transform .35s;transition:transform .35s}
 figure.effect-goliath img{-webkit-backface-visibility:hidden;backface-visibility:hidden}
 figure.effect-goliath h2,figure.effect-goliath p{position:absolute;bottom:0;left:0;padding:30px}
 figure.effect-goliath p{text-transform:none;font-size:90%;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(0,50px,0);transform:translate3d(0,50px,0)}
 figure.effect-goliath:hover img{-webkit-transform:translate3d(0,-80px,0);transform:translate3d(0,-80px,0)}
 figure.effect-goliath:hover h2{-webkit-transform:translate3d(0,-100px,0);transform:translate3d(0,-100px,0)}
 figure.effect-goliath:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Hera :*/
 figure.effect-hera{background:#303fa9}
 figure.effect-hera h2{font-size:158.75%}
 figure.effect-hera h2,figure.effect-hera p{position:absolute;top:50%;left:50%;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0);-webkit-transform-origin:50%;transform-origin:50%}
 figure.effect-hera figcaption::before{position:absolute;top:50%;left:50%;width:200px;height:200px;border:2px solid #fff;content:'';opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-50%,-50%,0) rotate3d(0,0,1,-45deg) scale3d(0,0,1);transform:translate3d(-50%,-50%,0) rotate3d(0,0,1,-45deg) scale3d(0,0,1);-webkit-transform-origin:50%;transform-origin:50%}
 figure.effect-hera p{width:100px;text-transform:none;font-size:121%;line-height:2}
 figure.effect-hera p a{color:#fff}
 figure.effect-hera p a:hover,figure.effect-hera p a:focus{opacity:.6}
 figure.effect-hera p a i{opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-hera p a:first-child i{-webkit-transform:translate3d(-60px,-60px,0);transform:translate3d(-60px,-60px,0)}
 figure.effect-hera p a:nth-child(2) i{-webkit-transform:translate3d(60px,-60px,0);transform:translate3d(60px,-60px,0)}
 figure.effect-hera p a:nth-child(3) i{-webkit-transform:translate3d(-60px,60px,0);transform:translate3d(-60px,60px,0)}
 figure.effect-hera p a:nth-child(4) i{-webkit-transform:translate3d(60px,60px,0);transform:translate3d(60px,60px,0)}
 figure.effect-hera:hover figcaption::before{opacity:1;-webkit-transform:translate3d(-50%,-50%,0) rotate3d(0,0,1,-45deg) scale3d(1,1,1);transform:translate3d(-50%,-50%,0) rotate3d(0,0,1,-45deg) scale3d(1,1,1)}
 figure.effect-hera:hover h2{opacity:0;-webkit-transform:translate3d(-50%,-50%,0) scale3d(0.8,0.8,1);transform:translate3d(-50%,-50%,0) scale3d(0.8,0.8,1)}
 figure.effect-hera:hover p i:empty{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}
 
 /* Winston :*/
figure.effect-winston{background:#162633;text-align:left}
 figure.effect-winston img{-webkit-transition:opacity .45s;transition:opacity .45s;-webkit-backface-visibility:hidden;backface-visibility:hidden}
 figure.effect-winston figcaption::before{position:absolute;top:0;left:0;width:100%;height:100%;background:url(../img/triangle.svg) no-repeat center center;background-size:100% 100%;content:'';-webkit-transition:opacity .45s,-webkit-transform .45s;transition:opacity .45s,transform .45s;-webkit-transform:rotate3d(0,0,1,45deg);transform:rotate3d(0,0,1,45deg);-webkit-transform-origin:0 100%;transform-origin:0 100%}
 figure.effect-winston h2{-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}
 figure.effect-winston p{position:absolute;right:0;bottom:0;padding:0 1.5em 7% 0}
 figure.effect-winston a{margin:0 10px;color:#5d504f;font-size:170%}
 figure.effect-winston a:hover,figure.effect-winston a:focus{color:#cc6055}
 figure.effect-winston p a i{opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(0,50px,0);transform:translate3d(0,50px,0)}
 figure.effect-winston:hover img{opacity:.6}
 figure.effect-winston:hover h2{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-winston:hover figcaption::before{opacity:.7;-webkit-transform:rotate3d(0,0,1,20deg);transform:rotate3d(0,0,1,20deg)}
 figure.effect-winston:hover p i{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-winston:hover p a:nth-child(3) i{-webkit-transition-delay:.05s;transition-delay:.05s}
 figure.effect-winston:hover p a:nth-child(2) i{-webkit-transition-delay:.1s;transition-delay:.1s}
 figure.effect-winston:hover p a:first-child i{-webkit-transition-delay:.15s;transition-delay:.15s}
 
 /* Selena :*/
 figure.effect-selena{background:#fff}
figure.effect-selena img{opacity:.95;-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform-origin:50% 50%;transform-origin:50% 50%}
figure.effect-selena:hover img{-webkit-transform:scale3d(0.95,0.95,1);transform:scale3d(0.95,0.95,1)}
figure.effect-selena h2{-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,20px,0);transform:translate3d(0,20px,0)}
figure.effect-selena p{opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:perspective(1000px) rotate3d(1,0,0,90deg);transform:perspective(1000px) rotate3d(1,0,0,90deg);-webkit-transform-origin:50% 0;transform-origin:50% 0}
figure.effect-selena:hover h2{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
figure.effect-selena:hover p{opacity:1;-webkit-transform:perspective(1000px) rotate3d(1,0,0,0);transform:perspective(1000px) rotate3d(1,0,0,0)}

/* Terry :*/
figure.effect-terry{background:#34495e}
 figure.effect-terry figcaption{padding:1em}
 figure.effect-terry figcaption::before,figure.effect-terry figcaption::after{position:absolute;width:200%;height:200%;border-style:solid;border-color:#101010;content:'';-webkit-transition:-webkit-transform .35s;transition:transform .35s}
 figure.effect-terry figcaption::before{right:0;bottom:0;border-width:0 70px 60px 0;-webkit-transform:translate3d(70px,60px,0);transform:translate3d(70px,60px,0)}
 figure.effect-terry figcaption::after{top:0;left:0;border-width:15px 0 0 15px;-webkit-transform:translate3d(-15px,-15px,0);transform:translate3d(-15px,-15px,0)}
 figure.effect-terry img,figure.effect-terry p a{-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-terry img{opacity:.85}
 figure.effect-terry h2{position:absolute;bottom:0;left:0;padding:.4em 10px;width:50%;-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}
 @media screen and (max-width:920px){
 figure.effect-terry h2{padding:.75em 10px;font-size:120%}
 }
 figure.effect-terry p{float:right;clear:both;text-align:left;text-transform:none;font-size:111%}
 figure.effect-terry p a{display:block;margin-bottom:1em;color:#fff;opacity:0;-webkit-transform:translate3d(90px,0,0);transform:translate3d(90px,0,0)}
 figure.effect-terry p a:hover,figure.effect-terry p a:focus{color:#f3cf3f}
 figure.effect-terry:hover figcaption::before,figure.effect-terry:hover figcaption::after{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-terry:hover img{opacity:.6}
 figure.effect-terry:hover h2,figure.effect-terry:hover p a{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-terry:hover p a{opacity:1}
 figure.effect-terry:hover p a:first-child{-webkit-transition-delay:.025s;transition-delay:.025s}
 figure.effect-terry:hover p a:nth-child(2){-webkit-transition-delay:.05s;transition-delay:.05s}
 figure.effect-terry:hover p a:nth-child(3){-webkit-transition-delay:.075s;transition-delay:.075s}
 figure.effect-terry:hover p a:nth-child(4){-webkit-transition-delay:.1s;transition-delay:.1s}
 
 /* Phoebe :*/
 figure.effect-phoebe{background:#675983}
 figure.effect-phoebe img{opacity:.85;-webkit-transition:opacity .35s;transition:opacity .35s}
 figure.effect-phoebe:hover img{opacity:.6}
 figure.effect-phoebe figcaption::before{position:absolute;top:0;left:0;width:100%;height:100%;background:url(../img/triangle2.svg) no-repeat center center;background-size:100% 100%;content:'';-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:scale3d(5,2.5,1);transform:scale3d(5,2.5,1);-webkit-transform-origin:50% 50%;transform-origin:50% 50%}
 figure.effect-phoebe:hover figcaption::before{opacity:.6;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
 figure.effect-phoebe h2{margin-top:1em;-webkit-transition:transform .35s;transition:transform .35s;-webkit-transform:translate3d(0,40px,0);transform:translate3d(0,40px,0)}
 figure.effect-phoebe:hover h2{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-phoebe p a{color:#fff;font-size:140%;opacity:0;position:relative;display:inline-block;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-phoebe p a:first-child{-webkit-transform:translate3d(-60px,-60px,0);transform:translate3d(-60px,-60px,0)}
 figure.effect-phoebe p a:nth-child(2){-webkit-transform:translate3d(0,60px,0);transform:translate3d(0,60px,0)}
 figure.effect-phoebe p a:nth-child(3){-webkit-transform:translate3d(60px,-60px,0);transform:translate3d(60px,-60px,0)}
 figure.effect-phoebe:hover p a{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 
 /* Apollo :*/
 figure.effect-apollo{background:#3498db}
 figure.effect-apollo img{opacity:.95;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:scale3d(1.05,1.05,1);transform:scale3d(1.05,1.05,1)}
 figure.effect-apollo figcaption::before{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(255,255,255,0.5);content:'';-webkit-transition:-webkit-transform .6s;transition:transform .6s;-webkit-transform:scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);transform:scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0)}
 figure.effect-apollo p{position:absolute;right:0;bottom:0;margin:3em;padding:0 1em;max-width:150px;border-right:4px solid #fff;text-align:right;opacity:0;-webkit-transition:opacity .35s;transition:opacity .35s}
 figure.effect-apollo h2{text-align:left}
 figure.effect-apollo:hover img{opacity:.6;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
 figure.effect-apollo:hover figcaption::before{-webkit-transform:scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);transform:scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0)}
 figure.effect-apollo:hover p{opacity:1;-webkit-transition-delay:.1s;transition-delay:.1s}
 
 /* Kira :*/
 figure.effect-kira{background:#fff;text-align:left}
 figure.effect-kira img{-webkit-transition:opacity .35s;transition:opacity .35s}
 figure.effect-kira figcaption{z-index:1}
 figure.effect-kira p{padding:2.25em .5em;font-weight:600;font-size:100%;line-height:1.5;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}
 figure.effect-kira p a{margin:0 .5em;color:#101010}
 figure.effect-kira p a:hover,figure.effect-kira p a:focus{opacity:.6}
 figure.effect-kira figcaption::before{position:absolute;top:0;right:2em;left:2em;z-index:-1;height:3.5em;background:#fff;content:'';-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(0,4em,0) scale3d(1,0.023,1);transform:translate3d(0,4em,0) scale3d(1,0.023,1);-webkit-transform-origin:50% 0;transform-origin:50% 0}
 figure.effect-kira:hover img{opacity:.5}
 figure.effect-kira:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-kira:hover figcaption::before{opacity:.7;-webkit-transform:translate3d(0,5em,0) scale3d(1,1,1);transform:translate3d(0,5em,0) scale3d(1,1,1)}
 
 /* Steve:*/
 figure.effect-steve{z-index:auto;overflow:visible;background:#000}
 figure.effect-steve:before,figure.effect-steve h2:before{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;background:#000;content:'';-webkit-transition:opacity .35s;transition:opacity .35s}
 figure.effect-steve:before{box-shadow:0 3px 30px rgba(0,0,0,0.8);opacity:0}
 figure.effect-steve figcaption{z-index:1}
 figure.effect-steve img{opacity:1;-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:perspective(1000px) translate3d(0,0,0);transform:perspective(1000px) translate3d(0,0,0)}
 figure.effect-steve h2,figure.effect-steve p{background:#fff;color:#2d434e}
 figure.effect-steve h2{position:relative;margin-top:2em;padding:.25em}
 figure.effect-steve h2:before{box-shadow:0 1px 10px rgba(0,0,0,0.5)}
 figure.effect-steve p{margin-top:1em;padding:.5em;font-weight:800;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:scale3d(0.9,0.9,1);transform:scale3d(0.9,0.9,1)}
 figure.effect-steve:hover:before{opacity:1}
 figure.effect-steve:hover img{-webkit-transform:perspective(1000px) translate3d(0,0,21px);transform:perspective(1000px) translate3d(0,0,21px)}
 figure.effect-steve:hover h2:before{opacity:0}
 figure.effect-steve:hover p{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
 
  /* Moses: */
 figure.effect-moses{background:-webkit-linear-gradient(-45deg,#ec65b7 0,#05e0d8 100%);background:linear-gradient(-45deg,#ec65b7 0,#05e0d8 100%)}
 figure.effect-moses img{opacity:.85;-webkit-transition:opacity .35s;transition:opacity .35s}
 figure.effect-moses h2,figure.effect-moses p{padding:20px;width:50%;height:50%;border:2px solid #fff}
 figure.effect-moses h2{padding:20px;width:50%;height:50%;text-align:left;-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(10px,10px,0);transform:translate3d(10px,10px,0)}
 figure.effect-moses p{float:right;padding:20px;text-align:right;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0)}
 figure.effect-moses:hover h2{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-moses:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-moses:hover img{opacity:.6}
 
  /* Jazz: */
 figure.effect-jazz{background:-webkit-linear-gradient(-45deg,#f3cf3f 0,#f33f58 100%);background:linear-gradient(-45deg,#f3cf3f 0,#f33f58 100%)}
 figure.effect-jazz img{opacity:.9}
 figure.effect-jazz figcaption::after,figure.effect-jazz img,figure.effect-jazz p{-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-jazz figcaption::after{position:absolute;top:0;left:0;width:100%;height:100%;border-top:1px solid #fff;border-bottom:1px solid #fff;content:'';opacity:0;-webkit-transform:rotate3d(0,0,1,45deg) scale3d(1,0,1);transform:rotate3d(0,0,1,45deg) scale3d(1,0,1);-webkit-transform-origin:50% 50%;transform-origin:50% 50%}
 figure.effect-jazz h2,figure.effect-jazz p{opacity:1;-webkit-transform:scale3d(0.8,0.8,1);transform:scale3d(0.8,0.8,1)}
 figure.effect-jazz h2{padding-top:26%;-webkit-transition:-webkit-transform .35s;transition:transform .35s}
 figure.effect-jazz p{padding:.5em 2em;text-transform:none;font-size:.85em;opacity:0}
 figure.effect-jazz:hover img{opacity:.7;-webkit-transform:scale3d(1.05,1.05,1);transform:scale3d(1.05,1.05,1)}
 figure.effect-jazz:hover figcaption::after{opacity:1;-webkit-transform:rotate3d(0,0,1,45deg) scale3d(1,1,1);transform:rotate3d(0,0,1,45deg) scale3d(1,1,1)}
 figure.effect-jazz:hover h2,figure.effect-jazz:hover p{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
 
 /* Ming: */
 figure.effect-ming{background:#030c17}
 figure.effect-ming img{opacity:.9;-webkit-transition:opacity .35s;transition:opacity .35s}
 figure.effect-ming figcaption::before{position:absolute;top:30px;right:30px;bottom:30px;left:30px;border:2px solid #fff;box-shadow:0 0 0 30px rgba(255,255,255,0.2);content:'';opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:scale3d(1.4,1.4,1);transform:scale3d(1.4,1.4,1)}
 figure.effect-ming h2{margin:20% 0 10px 0;-webkit-transition:-webkit-transform .35s;transition:transform .35s}
 figure.effect-ming p{padding:1em;opacity:0;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:scale(1.5);transform:scale(1.5)}
 figure.effect-ming:hover h2{-webkit-transform:scale(0.9);transform:scale(0.9)}
 figure.effect-ming:hover figcaption::before,figure.effect-ming:hover p{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
 figure.effect-ming:hover figcaption{background-color:rgba(58,52,42,0)}
 figure.effect-ming:hover img{opacity:.4}
 
  /* Lexi: */
  figure.effect-lexi{background:-webkit-linear-gradient(-45deg,#000 0,#fff 100%);background:linear-gradient(-45deg,#000 0,#fff 100%)}
 figure.effect-lexi img{margin:-10px 0 0 -10px;max-width:none;width:-webkit-calc(100%+10px);width:calc(100%+10px);opacity:.9;-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s;-webkit-transform:translate3d(10px,10px,0);transform:translate3d(10px,10px,0);-webkit-backface-visibility:hidden;backface-visibility:hidden}
 figure.effect-lexi figcaption::before,figure.effect-lexi p{-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-lexi figcaption::before{position:absolute;right:-100px;bottom:-100px;width:300px;height:300px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 900px rgba(255,255,255,0.2);content:'';opacity:0;-webkit-transform:scale3d(0.5,0.5,1);transform:scale3d(0.5,0.5,1);-webkit-transform-origin:50% 50%;transform-origin:50% 50%}
 figure.effect-lexi:hover img{opacity:.6;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
 figure.effect-lexi h2{text-align:left;-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:translate3d(5px,5px,0);transform:translate3d(5px,5px,0)}
 figure.effect-lexi p{position:absolute;right:0;bottom:0;padding:0 1.5em 1.5em 0;width:140px;text-align:right;opacity:0;-webkit-transform:translate3d(20px,20px,0);transform:translate3d(20px,20px,0)}
 figure.effect-lexi:hover figcaption::before{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
 figure.effect-lexi:hover h2,figure.effect-lexi:hover p{opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
  
   /* Duke: */
 figure.effect-duke{background:-webkit-linear-gradient(-45deg,#34495e 0,#cc6055 100%);background:linear-gradient(-45deg,#34495e 0,#cc6055 100%)}
 figure.effect-duke img,figure.effect-duke p{-webkit-transition:opacity .35s,-webkit-transform .35s;transition:opacity .35s,transform .35s}
 figure.effect-duke:hover img{opacity:.1;-webkit-transform:scale3d(2,2,1);transform:scale3d(2,2,1)}
 figure.effect-duke h2{-webkit-transition:-webkit-transform .35s;transition:transform .35s;-webkit-transform:scale3d(0.8,0.8,1);transform:scale3d(0.8,0.8,1);-webkit-transform-origin:50% 100%;transform-origin:50% 100%}
 figure.effect-duke p{position:absolute;bottom:0;left:0;margin:20px;padding:30px;border:2px solid #fff;text-transform:none;font-size:90%;opacity:0;-webkit-transform:scale3d(0.8,0.8,1);transform:scale3d(0.8,0.8,1);-webkit-transform-origin:50% -100%;transform-origin:50% -100%}
 figure.effect-duke:hover h2,figure.effect-duke:hover p{opacity:1;-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}