.grid {
    width: 90%;
	max-width: 100rem;
	list-style: none;
	margin: 30px auto 0 auto;
	padding: 0;
}

.grid li {
	display: block;
	float: left;
	padding: 7px;
	width: 33%;
	opacity: 0;
}

.grid li.shown,
.no-js .grid li,
.no-cssanimations .grid li {
	opacity: 1;
}

.grid li a,
.grid li img {
	outline: none;
	border: none;
	display: block;
	max-width: 100%;
    box-shadow: 0px 0px 5px 0px rgba(32,32,32,0.2);
}

.grid li img:hover {
    transform: translateY(-5px);
    box-shadow: 0px 10px 10px 5px rgba(32,32,32,0.35);
}

/* Effect 2: Move Up */
.grid.effect-2 li.animate {
	-webkit-transform: translateY(200px);
	transform: translateY(200px);
	-webkit-animation: moveUp 0.65s ease forwards;
	animation: moveUp 0.65s ease forwards;
}

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

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

@media screen and (max-width: 900px) {
	.grid li {
		width: 50%;
	}
}

@media screen and (max-width: 480px) {
	.grid li {
		width: 100%;
	}
}





.modal-content div h2 {
    text-align: center;
    font-size: 4.8rem;
    font-weight: 900;
    padding-bottom: 30px;
    border-bottom: 1px solid #BEBEBE;
    line-height: 1;
}

.modal-content div h2 span{
    font-size: 2.1rem;
    font-weight: 600;
}

.modal-content div img{
    display: inline-block;
    vertical-align: middle;
    margin: 1.25%;
}

.modal-content div video{
    display: inline-block;
    vertical-align: middle;
    margin: 1.25%;
}

.modal-content div p{
    display: inline-block;
    vertical-align: middle;
    font-size: 2.1rem;
    margin: 1.25%;
}


#hoodspot img:nth-of-type(1){
    width: 64%;
    margin-top: 30px;
}

#hoodspot video:nth-of-type(1){
    width: 64%;
}

#hoodspot video:nth-of-type(2){
    width: 70%;
}

#hoodspot video:nth-of-type(3){
    width: 31%;
}

#hoodspot video:nth-of-type(4){
    width: 70%;
}

#hoodspot img:nth-of-type(2){
    width: 30%;
}

#hoodspot video:nth-of-type(5){
    width: 43%;
}

#hoodspot img:nth-of-type(3){
    width: 60%;
}


#hoodspot img:nth-of-type(4){
    width: 60%;
}

#hoodspot p:nth-of-type(1){
    width: 30%;
}

#hoodspot p:nth-of-type(2){
    width: 30%;
    text-align: right;
}

#hoodspot p:nth-of-type(3){
    width: 24%;
}

#hoodspot p:nth-of-type(4){
    width: 31%;
}

#hoodspot p:nth-of-type(5){
    width: 24%;
    text-align: right;
}

#hoodspot p:nth-of-type(6){
    width: 34%;
}

#hoodspot p:nth-of-type(7){
    width: 34%;
    text-align: right;
}

#box video:nth-of-type(1){
    width: 24%;
}

#box video:nth-of-type(2){
    width: 70%;
}

#box video:nth-of-type(3){
    width: 60%;
}

#box img:nth-of-type(1){
    width: 60%;
}

#box video:nth-of-type(4){
    width: 70%;
}

#box video:nth-of-type(5){
    width: 70%;
}

#box p:nth-of-type(1){
    text-align: center;
    margin-top: 30px;
}

#box p:nth-of-type(2){
    width: 34%;
}

#box p:nth-of-type(3){
    width: 34%;
    text-align: right;
}

#box p:nth-of-type(4){
    width: 24%;
}

#box p:nth-of-type(5){
    width: 24%;
    text-align: right;
}


#annuaire video:nth-of-type(1){
    width: 70%;
}

#annuaire img:nth-of-type(1){
    width: 64%;
}

#annuaire video:nth-of-type(2){
    width: 60%;
}

#annuaire img:nth-of-type(2){
    width: 47%;
}

#annuaire img:nth-of-type(3){
    width: 47%;
}

#annuaire img:nth-of-type(4){
    width: 47%;
}

#annuaire img:nth-of-type(5){
    width: 22.3%;
}

#annuaire img:nth-of-type(6){
    width: 22.3%;
}

#annuaire img:nth-of-type(7){
    width: 22.3%;
}

#annuaire img:nth-of-type(8){
    width: 22.3%;
}

#annuaire img:nth-of-type(9){
    width: 22.3%;
}

#annuaire p:nth-of-type(1){
    width: 97.5%;
    text-align: center;
    margin-top: 30px;
}

#annuaire p:nth-of-type(2){
    width: 24%;
}

#annuaire p:nth-of-type(3){
    width: 30%;
    text-align: right;
}

#annuaire p:nth-of-type(4){
    width: 34%;
}

#annuaire p:nth-of-type(5){
    width: 47%;
}

#annuaire p:nth-of-type(6){
    width: 97.5%;
    text-align: center;
}

#annuaire p:nth-of-type(7){
    width: 70%;
}

#airfrance img:nth-of-type(1){
    width: 60%;
    margin-top: 30px;
}

#airfrance img:nth-of-type(2){
    width: 50%;
}

#airfrance img:nth-of-type(3){
    width: 70%;
}

#airfrance img:nth-of-type(4){
    width: 47%;
}

#airfrance img:nth-of-type(5){
    width: 47%;
}

#airfrance img:nth-of-type(6){
    width: 97.5%;
}

#airfrance p:nth-of-type(1){
    width: 34%;
}

#airfrance p:nth-of-type(2){
    width: 44%;
    text-align: right;
}

#airfrance p:nth-of-type(3){
    width: 24%;
}

#airfrance p:nth-of-type(4){
    width: 97.5%;
    text-align: center;
}

#airfrance p:nth-of-type(5){
    width: 97.5%;
    text-align: center;
}

#cassina video{
    width: 80%;
    margin-left: 10%;
    margin-top: 30px;
}

#cassina p{
    width: 94%;
    text-align: center;
    margin: 3%;
}

#medicinal p{
    text-align: center;
    margin: 3%;
}

#medicinal a{
    margin-left: 30%;
    width: 40%;
    display: inline-block;
}

#medicinal a img{
    width: 100%;    
}

#rodin p{
    text-align: center;
    margin: 3%;
    width: 94%;
}

#rodin p:nth-of-type(2){
    font-size: 2.1rem;
}

#rodin video{
    width: 80%;
    margin: 0 0 50px 10%;
}

#algeco video{
    width: 80%;
    margin-left: 10%;
    margin-top: 30px;
}

#algeco p{
    width: 94%;
    text-align: center;
    margin: 3%;
}

#yaka img:nth-of-type(1){
    width: 60%;
    margin-top: 30px;
}

#yaka img:nth-of-type(2){
    width: 60%;
}

#yaka img:nth-of-type(3){
    width: 47%;
}

#yaka img:nth-of-type(4){
    width: 47%;
}

#yaka img:nth-of-type(5){
    width: 60%;
}

#yaka img:nth-of-type(6){
    width: 47%;
}

#yaka img:nth-of-type(7){
    width: 47%;
}

#yaka p:nth-of-type(1){
    width: 34%;
}

#yaka p:nth-of-type(2){
    width: 34%;
    text-align: right;
}

#yaka p:nth-of-type(3){
    width: 97.5%;
    text-align: center;
}

#yaka p:nth-of-type(4){
    width: 34%;
}

#yaka p:nth-of-type(5){
    text-align: center;
}

#latourex video{
    width: 80%;
    margin-left: 10%;
    margin-top: 30px;
}

#latourex p{
    width: 94%;
    text-align: center;
    margin: 3%;
}

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

.modal-content div h2 {
    font-size: 3.6rem;
    border-bottom: 1px solid #BEBEBE;
}

.modal-content div img{
    margin: 0%;
}
    
.modal-content div video{
    margin: 0%;
}
    
.modal-content div p{
    font-size: 1.8rem;
    margin: 20px 0 20px 0;
    text-align: center;
}

#hoodspot video:nth-of-type(1){
    width: 100%;
}

#hoodspot img:nth-of-type(1){
    width: 100%;
    margin-top: 30px;
}

#hoodspot video:nth-of-type(2){
    width: 100%;
}

#hoodspot video:nth-of-type(3){
    width: 49%;
}

#hoodspot video:nth-of-type(4){
    width: 100%;
}

#hoodspot img:nth-of-type(2){
    width: 49%;
}

#hoodspot video:nth-of-type(5){
    width: 100%;
}

#hoodspot img:nth-of-type(3){
    width: 100%;
}


#hoodspot img:nth-of-type(4){
    width: 100%;
}

#hoodspot p:nth-of-type(1){
    width: 100%;
}

#hoodspot p:nth-of-type(2){
    width: 100%;
    text-align: center;
}

#hoodspot p:nth-of-type(3){
    width: 100%;
}

#hoodspot p:nth-of-type(4){
    width: 100%;
}

#hoodspot p:nth-of-type(5){
    width: 100%;
    text-align: center;
}

#hoodspot p:nth-of-type(6){
    width: 100%;
}

#hoodspot p:nth-of-type(7){
    width: 100%;
    text-align: center;
}

#box video:nth-of-type(1){
    width: 40%;
}

#box video:nth-of-type(2){
    width: 100%;
}

#box video:nth-of-type(3){
    width: 100%;
}

#box img:nth-of-type(1){
    width: 100%;
}

#box video:nth-of-type(4){
    width: 100%;
}

#box video:nth-of-type(5){
    width: 100%;
}

#box p:nth-of-type(1){
    width: 55%;
    text-align: right;
}
    
#box p:nth-of-type(2){
    width: 100%;
}

#box p:nth-of-type(3){
    width: 100%;
    text-align: center;
}

#box p:nth-of-type(4){
    width: 100%;
}

#box p:nth-of-type(5){
    width: 100%;
    text-align: center;
}


#annuaire video:nth-of-type(1){
    width: 100%;
    margin-top: 30px;
}

#annuaire img:nth-of-type(1){
    width: 100%;
}

#annuaire video:nth-of-type(2){
    width: 100%;
}

#annuaire img:nth-of-type(2){
    width: 100%;
}

#annuaire img:nth-of-type(3){
    width: 49%;
}

#annuaire img:nth-of-type(4){
    width: 49%;
}

#annuaire img:nth-of-type(5){
    width: 32.5%;
}

#annuaire img:nth-of-type(6){
    width: 32.5%;
}

#annuaire img:nth-of-type(7){
    width: 32.5%;
}

#annuaire img:nth-of-type(8){
    width: 32.5%;
}

#annuaire img:nth-of-type(9){
    width: 32.5%;
}

#annuaire p:nth-of-type(2){
    width: 100%;
}

#annuaire p:nth-of-type(3){
    width: 100%;
    text-align: center;
}

#annuaire p:nth-of-type(4){
    width: 100%;
}

#annuaire p:nth-of-type(5){
    width: 100%;
}

#annuaire p:nth-of-type(6){
    width: 100%;
}

#annuaire p:nth-of-type(7){
    width: 32.5%;
    text-align: left;
}
    
#airfrance img:nth-of-type(1){
    width: 100%;
    margin-top: 30px;
}

#airfrance img:nth-of-type(2){
    width: 100%;
}

#airfrance img:nth-of-type(3){
    width: 100%;
}

#airfrance img:nth-of-type(4){
    width: 100%;
}

#airfrance img:nth-of-type(5){
    width: 100%;
}

#airfrance img:nth-of-type(6){
    width: 100%;
}

#airfrance p:nth-of-type(1){
    width: 100%;
    text-align: center;
}

#airfrance p:nth-of-type(2){
    width: 100%;
    text-align: center;
}

#airfrance p:nth-of-type(3){
    width: 100%;
    text-align: center;
}

#airfrance p:nth-of-type(4){
    width: 100%;
    text-align: center;
}

#airfrance p:nth-of-type(5){
    width: 100%;
    text-align: center;
}

#cassina video{
    width: 100%;
    margin-left: 0%;
}
    
#medicinal a{
    margin-left: 10%;
    width: 80%;
}

#algeco video{
    width: 100%;
    margin: 0%;
}

#yaka img:nth-of-type(1){
    width: 100%;
}

#yaka img:nth-of-type(2){
    width: 100%;
}

#yaka img:nth-of-type(3){
    width: 100%;
}

#yaka img:nth-of-type(4){
    width: 100%;
}

#yaka img:nth-of-type(5){
    width: 100%;
}

#yaka img:nth-of-type(6){
    width: 100%;
}

#yaka img:nth-of-type(7){
    width: 100%;
}

#yaka p:nth-of-type(1){
    width: 100%;
    text-align: center;
}

#yaka p:nth-of-type(2){
    width: 100%;
    text-align: center;
}


#yaka p:nth-of-type(4){
    width: 100%;
    text-align: center;
}

#latourex video{
    width: 100%;
    margin-left: 0%;
}

}

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

#hoodspot video:nth-of-type(3){
    width: 100%;
}
#hoodspot img:nth-of-type(2){
    width: 100%;
}
    
#box video:nth-of-type(1){
    width: 100%;
}

#box p:nth-of-type(1){
    width: 100%;
    text-align: center;
}
    
#annuaire img:nth-of-type(3){
    width: 100%;
}

#annuaire img:nth-of-type(4){
    width: 100%;
}

#annuaire img:nth-of-type(5){
    width: 100%;
}

#annuaire img:nth-of-type(6){
    width: 100%;
}

#annuaire img:nth-of-type(7){
    width: 100%;
}

#annuaire img:nth-of-type(8){
    width: 100%;
}

#annuaire img:nth-of-type(9){
    width: 100%;
}
#annuaire p:nth-of-type(7){
    width: 100%;
    text-align: center;
}
}