/* Portfolio */
.gallerie  {margin: 0 -3% 50px -77.5%;clear: both;padding: 0;right: 0;left: 0;display: block;}
.gallerie:focus {outline: none;}
html li .show:focus {outline: none;}
.update li.shown {outline: none;}

article .gallerie ul li:first-child {margin: 0;}

.update_jaune ul {margin: 0 0 0 -5px;}
.update_jaune {padding: 5px;display: block;overflow: hidden;}
.update_jaune:hover {opacity: .8;}
.update_jaune:focus {outline: none;}
.update {max-width: 100%;width: 100%;list-style: none;padding: 0;margin-right: auto;margin-top: 0px;margin-bottom: 0px;}
.update ul li:first-child {display: block;float: left;padding: 5px;width: 33.3%;opacity: 0;margin: 0;}
.update li:first-child {display: block;float: left;padding: 5px;width: 33.3%;opacity: 0;margin: 0;}
.update li {display: block;float: left;padding: 5px;width: 33.3%;opacity: 0;margin: 0;}
.update .texte p {text-align: left;}
.update li.shown,
.no-js .update li,
.no-cssanimations .update li {opacity: 1;}

.update li.img-responsive {display: block;height: auto;}

/* Work detail */
.work-detail {position: absolute;opacity: 0;background: rgba(254, 249, 208, 0.9);-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;text-align: center;margin-left: auto;margin-right: auto;top: 35px;right: 35px;bottom: 35px;left: 35px;}
.work-detail h3 {font-size: 3em;font-weight: 600;text-align: center;line-height: 1.1em;color: #000;}
.work-detail h3 {margin: 0;padding: 15px;}
.work-items li:hover .work-detail{ opacity: 1;color: #000;}

.vertical-centered {position: absolute;top: 50%;-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);transform: translateY(-50%);width: 100%;}

@media screen and (max-width: 1025px) {
	.update li {width: 33%;padding: 5px 8px;margin-right: auto;margin-left: auto;}
	.update_jaune {padding: 0;margin: 5px auto;}
}
	
@media screen and (max-width: 769px) {
	.gallerie {margin: 0 auto 50px;clear: both;padding: 0;right: 0;left: 0;}
	.update li {width: 49%;padding: 5px 8px;margin-right: auto;margin-left: auto;}
	.update_jaune {padding: 0;margin: 5px auto;}
}
	
@media screen and (max-width: 641px) {
	.gallerie {margin: 0 auto 50px;}
	.update li {width: 100%;padding: 10px 0;margin: 5px auto;}
	.img-responsive {margin-left: auto;margin-right: auto;padding: 0;border: 0;}
}

/* Effect 1: opacity */
.update.effect-1 li.animate {
	-webkit-animation: fadeIn 0.65s ease forwards;
	animation: fadeIn 0.65s ease forwards;
}

@-webkit-keyframes fadeIn {
	0% { }
	100% { opacity: 1; }
}

@keyframes fadeIn {
	0% { }
	100% { opacity: 1; }
}
	
/* Effect 2: Move Up */
.update.effect-2 li.animate {-webkit-transform: translateY(200px);-moz-transform: translateY(200px);transform: translateY(100px);-webkit-animation: moveUp 0.65s ease forwards;-moz-animation: moveUp 0.65s ease forwards;animation: moveUp 0.65s ease forwards;}

@-webkit-keyframes moveUp {to { -webkit-transform: translateY(0);opacity: 1;}}
@-moz-keyframes moveUp {to { -moz-transform: translateY(0);opacity: 1;}}
@keyframes moveUp {to { transform: translateY(0);opacity: 1;}}

@-webkit-keyframes popUp { 80% { -webkit-transform: scale(1.1);opacity: .8;-webkit-animation-timing-function: ease-out;} 100% {-webkit-transform: scale(1);opacity: 1;} }
@-moz-keyframes popUp { 80% { -moz-transform: scale(1.1);opacity: .8;-moz-animation-timing-function: ease-out;} 100% {-moz-transform: scale(1);opacity: 1;} }
@keyframes popUp { 80% { transform: scale(1.1);opacity: .8;animation-timing-function: ease-out;} 100% {transform: scale(1);opacity: 1;} }
