/* -------------------------- Sommaire -------------------------

1 - Reset css
2 - Fonts
3 - Landing
4 - Header
5 - Headlines + Buttons
6 - Sticky navbar
7 - Compagnon.inspiration .description {
8 - Inspiration
9 - Envies - Recettes
10 - Recettes visuelles
11 - Clients
12 - Footer
13 - Responsive
	13 - 1 - Mobile
	13 - 2 - Tablette
	13 - 3 - 13"

/* -------------------------- Sommaire -------------------------- */

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	text-decoration:none;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* -------------------------- Fonts -------------------------- */

 @font-face{
font-family:"Avenir regular";
src:url("/font/1437496/483d8937-5e17-4378-9c51-aa91a3d9e1eb.eot?#iefix");
src:url("/font/1437496/483d8937-5e17-4378-9c51-aa91a3d9e1eb.eot?#iefix") format("eot"),url("/font/1437496/ed4b9060-b5ab-4379-8840-0b50a15258b7.woff2") format("woff2"),url("/font/1437496/9b47db0b-77fb-4bb0-b5c2-3c131a36fc4d.woff") format("woff"),url("/font/1437496/9c8b7e5f-b3ca-435d-a197-b3dfeae277a1.ttf") format("truetype"),url("/font/1437496/0f72ee75-31c8-42ba-b262-3e13b83a8fdf.svg#0f72ee75-31c8-42ba-b262-3e13b83a8fdf") format("svg");
}
@font-face{
font-family:"Avenir Demi";
src:url("/font/1437516/47d79f32-82c5-4a74-9646-5150297aabc1.eot?#iefix");
src:url("/font/1437516/47d79f32-82c5-4a74-9646-5150297aabc1.eot?#iefix") format("eot"),url("/font/1437516/249228f0-61ac-40cc-a5a5-5609c9816e3f.woff2") format("woff2"),url("/font/1437516/efba18ed-80cc-49c4-997a-fbb140739d19.woff") format("woff"),url("/font/1437516/750a20ec-9242-42a8-b3bd-c4dcec552196.ttf") format("truetype"),url("/font/1437516/9505c912-495c-462c-899a-e61574ee9559.svg#9505c912-495c-462c-899a-e61574ee9559") format("svg");
}


body {
	line-height: 1;
	font-family:"Avenir regular";
	font-size:16px;
}


h1{
	font-size:35px;
	color:white;
	margin-bottom:10px;
	font-family:"Avenir Demi";
}

h2{
	font-size:24px;
	font-weight:bold;
	line-height:30px;
	margin-bottom:10px;
	font-family:"Avenir Demi";
}


.description {
	color: #ff3539;
}
.description p {font-size: 16px;}


.desktop {display:block;}
.mobile {display:none;}

/* -------------------------- Landing -------------------------- */



.landing, .login, .signup {
  margin:0;
  padding:0;
  background: url('/images/landing/background.png') no-repeat;
  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
  height:100vh;
  position: relative;
}


.advertise-youmiam {
	align-self: center;
}


.error-text-modal li {
    list-style: none;
}
.connect .error-text-modal, .connect .help-block {
    color: white;
}

/* -------------------------- Header -------------------------- */

.top-landing-page {
    position: absolute;
	top: 15px;
	display: flex;
	align-items: center;
	width: 98%;
	justify-content: space-between;
	align-self: center;
}

#landing-logo {
	max-width:150px;
	margin-top:2px;
}

.bar {
  padding: 2% 5%;
}
.nav>li>a {
	padding:5px 15px;
}

.bar.logo {position:absolute;left:30px;top:30px;}


ul.main-menu{
	list-style: none;
	line-height: 50px;
}

ul.main-menu li{
	display:inline;
	padding:20px;
}

ul.main-menu li a{
	color:white;
	text-decoration: none
}

ul.main-menu li a:hover{
	color:#E6E6E6;
	text-decoration: none
}

.connect {
	width : 100%;
	height:calc(100vh - 60px);
	text-align:center;
	display: flex;
    flex-direction: column;
    justify-content: center;
}
.logo-white {
	align-self: center;
}

.logo-white{
	width:80px;
}


.login-button {
    border: none;
    color: white;
    padding: 5px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    cursor: pointer;
    text-transform: uppercase;
   	border-radius :4px;
   	display:inline;
   	height: 30px;
}

.error-text-modal{
	color:red;
}

.lang {
	display:inline;
	float:right;
}

.dropdown-toggle {
	padding-right: 0px;
}


.dropdown-toggle.lang-padding {
	padding: 5px 20px;
}

.lang li a{
	color:white;
}

.lang li a:hover {
	background :none;
	color:#E6E6E6;
}

.lang li a b.caret{
	border-top-color: white !important;
    border-bottom-color: white !important;
}

.lang li a:hover b.caret{
	border-top-color: #E6E6E6 !important;
    border-bottom-color: #E6E6E6 !important;
}

.lang-dropdown{
    width: 100%;
    background: none !important;
}

.dropdown a:active, .dropdown a:focus {
	background:none !important;
}

.dropdown-menu {
	min-width:30px !important;
}

.dropdown-menu>li>a {padding:3px 4px;}

/* -------------------------- Headlines + Buttons -------------------------- */


.slogan{
	color:white;
	margin-bottom:10px;
	font-family:"Avenir Regular";
}

.button-grey{
	background-color: rgba(255, 255, 255, 0.5);
}

.button-blue{
	background-color: rgba(0, 84, 166, 0.5);
}

.button-green{
	background-color: rgba(4, 222, 112, 0.5);
}

.main-button {
	line-height: normal;
    border: none;
    color: white;
    padding: 10px;
    width:25%;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    cursor: pointer;
    margin-top:10px;
    text-transform: uppercase;
   	border-radius :3px;
   	font-family:"Avenir Demi";
}

.main-input {
	line-height: normal;
    border: none;
    color: white;
    padding: 10px;
    width:25.5%;
    min-width:160px;
    text-align: center;
    text-decoration: none;
    display: block;
    font-size: 12px;
    margin:auto;
   	border-radius :2px;
   	background-color:rgba(255,255,255,0.3);
   	border-color:grey;
	margin-top: 0.2%;
}

select.main-input {
	height: 34px;
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    white;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:   white;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:   white;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:   white;
}
:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
  color:   white;
}

.input:focus {
    outline: none !important;
    border:1px solid grey!important;
    box-shadow: 0 0 10px #719ECE;
}

.ou {
	font-family:"Avenir Demi";
    text-align: center;
    position: relative;
    color:white;
    margin-bottom:10px;
	margin-left: 35%;
	margin-right: 35%;
}
.ou span {
    display: inline-block;
    margin-top:8px;
}
.ou span:before,
.ou span:after {
    border-top: 1px solid white;
    display: block;
    height: 1px;
    content: " ";
    width: 40%;
    position: absolute;
    left: 0;
    top: 1.2em;
}
.ou span:after {
   right: 0;
   left: auto;
}

.forgotten{
	margin-top:20px;
	display:block;
	color:white;
	font-size:12px;
	width:50%;
	margin:auto;
	padding-top:10px;
	cursor: pointer;
}

.forgotten:hover{
	color:white;
}

.identifiant {
	width:10%;
	display: inline-block;
}

.image_uploader {
	z-index: 100;
	left: calc(50% - 75px);
	margin: 0;
	height: 150px;
	min-height: 150px;
	max-height: 150px;
	width: 150px;
	min-width: 150px;
	max-width: 150px;
	position: absolute;
    opacity: 0;
    cursor: pointer;
}
.bar a:hover {
    text-decoration: none;
}
.main-input option {
	color: black;
}
.visuelles .wrapper .description {
	line-height: 120%;
}
/* -------------------------- Sticky navbar -------------------------- */


#sticky-navigation {
	background-color:white;
	width:100%;
	z-index:10;
	height:80px;
	display:flex;
	flex-direction: row;
	align-items:center;
	justify-content: center;
  box-shadow: 0 0 1px 1px rgba(0,0,0,.15);
}

.sticky-navigation-bottom {
    position:absolute;
    bottom:0;
    height:80px;
}

.sticky-navigation-fixed {
    position: fixed;
    top:0;
    height:80px;
}

.stores_links a{float:right;}

.stores_links a:hover {
	text-decoration:none;
}
.prices img {
	width:200px;
	height:auto;
}
.prices{
    display:flex;
    flex-direction:row;
}
.stores_links {display:flex;flex-direction: row;justify-content: flex-end;}
.stores_links a img{
	width:150px;
	height:auto;
}

.inactive {
	display:none;
}


/* -------------------------- Compagnon -------------------------- */

.compagnon {
	position:relative;
	height:600px;
}
.compagnon, .envies {
	background-color:#f2eeeb;
}

.compagnon .wrapper {
	display: flex;
	align-items: center;
	width:80%;
	margin:auto;
	padding:3%;

}

.compagnon .description {
	position:absolute;
	width:30%;
	z-index:2;
	line-height:120%;
	margin-top:0px;
	text-align:right;
	top:60%;
	left:20%;
}

.mascotte{
	position:absolute;
	right:19%;
	top: calc(45% - 250px);
	left: calc(65% - 250px);
	margin-left:-70px;
}


/* -------------------------- Inspiration -------------------------- */



.pic{
	text-align:center;
	padding:0;
	display:inline-block;
}

.pic-img-container {
    position:relative;
    padding-top:100%;
    overflow:hidden;
}

.pic-img-container-scale
{
	-webkit-filter: grayscale(100%) brightness(100%) contrast(100%);
	-moz-filter: grayscale(100%) brightness(100%) contrast(100%);
	-ms-filter: grayscale(100%) brightness(100%) contrast(100%);
	-o-filter: grayscale(100%) brightness(100%) contrast(100%);
	filter: grayscale(100%) brightness(100%) contrast(100%);
	filter: gray;
	position:relative;
	padding-top:100%;
	overflow:hidden;
}
.pic-logo img {
	width:100%;
	height:100%;
	position:absolute:;
}

.small_pic img, .pic img {
	width:100%;
	position:absolute;
	bottom:0;
	right:0
}

.sub-pic{padding:0;}

.sub-container{
	width:100%;
	position:absolute;
	top:0;
	left:0;
}


.small_pic{
	position:relative;
	text-align:center;
	padding:0;
}


.inspiration .description p {
line-height:120%;

}

.small_pic .informations, .pic .informations{
	width:100%;
	height:100%;
	font-family:'Avenir Demi';
	font-size:20px;
	position:absolute;
	overflow:hidden;
	top:0;
	left:0;
	opacity:0;
	background-color:rgba(255,53,57,0.4);
	-webkit-transition:all .1s ease-in-out;
	transition:all .1s ease-in-out;
	cursor:pointer;
}

/*.small_pic:hover img, .pic:hover img, .pic-logo:hover img {
	-ms-transform:scale(1.1);
	-webkit-transform:scale(1.1);
	transform:scale(1.1);
}*/



.small_pic:hover .informations, .pic:hover .informations, .pic-logo:hover .informations {
	opacity:1;
	filter:alpha(opacity=100);
}

.small_pic:hover h2, .small_pic:hover a.more , .pic:hover h2,.pic:hover a.more, .pic-logo:hover h2 {
	opacity:1;
	filter:alpha(opacity=100);
	-ms-transform:translatey(0);
	-webkit-transform:translatey(0);
	transform:translatey(0);
}


.informations p{
	padding:10px;
	padding-bottom:5px;
	text-align: right;
	color:white;
	font-family:'Avenir Demi';
	font-weight:400;
}

.more .glyphicon {
	color:#ff3539;
	font-size:30px;
}

	.inspiration .description {
	display: flex;
    flex-direction: column;
    float:left;
    margin:5%;
    margin-top: calc(26.5% - 97.5px);
	}

/* -------------------------- Envies - Recettes -------------------------- */


.envies{
	display:flex;
	align-items: center;
	justify-content: center;
	height:100%;
}

.envies .description {
	text-align: left;
	padding:5%;
}

.recettes {
	padding:5%;
	width:80%;
	height:100%;
	max-width: 1000px;
}

.recette{
	position:relative;
	padding:6px; /*MAX*/
	height:300px;
	width:225px;
	overflow:hidden;

}

.recette a{
	overflow:hidden;
	border-radius:5px;
	background-color:white;
	display: block;
    width: 100%;
    height: 100%;
}

.recette a:hover{text-decoration:hidden;}

.recette img{
    min-width: 100%;
	min-height:100%;
    height: 100%;
}

.recette-desc{
	height:44%;
	position:relative;
	left:0;
	bottom:20%;
	background-color:white;
}

.mask-desc{
	width:100%;
	height:100%;
	position:absolute;
	bottom:0;
	left:0;
	background-color:#ebeaea;
}

.profile{
	margin-top:-25px;
}

.profile .name {
	position:absolute;
	left:28%;
	top:8%;
	color:rgba(255,53,57,1);
	font-size:14px;
	display:inline-block;
}

.profile-pic {
	display:inline-block;
	position:absolute;
	bottom:78%;
	left:5%;
	width:45px;
	height:45px;
	border-radius:30px;
	border:2px solid white;
	box-shadow: 0 1px 2px rgba(0,0,0,0.2);
	overflow:hidden;
	float-left;
}

.recette-desc .titre{
	position:absolute;
	top:40px;
	width:85%;
	left:10px;
	font-weight:900;
	font-size:16px;
/*  width: 60%; /*MAX*/
}

.recette-more{
	background-color:#dfdbd8;
}

.rounded {
	border : 2px solid white;
	padding: 25px;
	font-size:26px;
	color:white;
	border-radius:50px;
}

.recette-more{
	display:flex;
	align-items: center;
	justify-content: center;
	flex-direction:column;
}

.recette-more p {
	color:white;
}


.titre h3 {
	color:black;
	font-size:14px;
	font-weight:500;
}

/* -------------------------- Recettes visuelles -------------------------- */


.visuelles .wrapper {
	display:flex;
	align-items:center;
	justify-content:center;
}


.visuelles-img {
	width:25%;
}

.visuelles .wrapper .description{
	width:30%;
	margin-top: -180px;
    margin-left: -100px;
}


/* -------------------------- Clients -------------------------- */

#arrow-member {
	position:absolute;
	bottom:7%;
	right:7%;
	width:16px
;}

.black-flash-message {
	color:black;
}

.landing-advertise {
	position:absolute;
	top:10px;
	width:100%;
	height:50px;
	color:white;
	padding-left: 8%;
	padding-right:8%;
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

.advertise-youmiam-href {
	text-decoration: none;
}

.advertise-youmiam-switch {
	align-self: center;
}

.clear-description {
	clear:both;
}
.image-advertise {
	display:flex;
	justify-content:flex-start;
	margin-bottom:1%;
}
.advertise-youmiam-text {
	color: rgba(255,255,255,0.8);
	width:225px;
	text-decoration: none;
}
.youmiam-advertise {
	position: absolute;
    left: calc(50% - 112.5px);
    top: 4%;
}

.verbatims{
	padding:20px;
	background-color:#f2eeeb;
}

.landing-clear {
	clear:both;
}

.verbatims-row {
	display:flex;
	align-items: center;
	height:250px;
}

.pic-logo{
	overflow:hidden;
	position:relative;
	text-align:center;
}

.signup-connect {
    width: 100%;
    height: 100vh;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.logos img{
	padding:4%;
}

.pic-logo .informations{
	width: 100%;
    height: 100%;
	color:white;
	font-family:'Avenir Demi';
	font-size:16px;
	padding:5px;
	position:absolute;
	overflow:hidden;
	top:0;
	left:0;
	opacity:0;
	background-color:rgba(255,53,57,0.5);
	-webkit-transition:all .1s ease-in-out;
	transition:all .1s ease-in-out;
	cursor:pointer;
	display:block;
}

.talk-about {
	display:flex;
	align-items:center;
}
.verbatims .description {
    text-align: center;
}

.envies.mobile {height:2100px!important;}

.main-button {
	width:35%;
    max-width: 250px;
}
.login-button {
    height:25px;
    font-size:12px;
}

/* -------------------------- Footer -------------------------- */

footer{
	position:relative;
	background-color:#ff3539;
	display:flex;
	align-items: center;
	justify-content: space-around;
	flex-wrap:wrap;
	padding:40px;
	height:190px;
}
footer img {
 	position:absolute;
 	left:0%;
 }
footer a{
	color:white;
}

footer a:hover, footer a:active, footer a:focus {
	color:white;
	text-decoration:underline;
}

footer p {
	align-self:flex-end;
	color:white;
	font-size:12px;
	position:absolute;
 	bottom:5%;
 	width:40%;
 	text-align:center;
 	left:30%;
 	right:14%;
}
.footer-links {
	display:flex;
 	flex-direction: column;
	align-items: flex-start;
	justify-content: space-around;
	height:100px;
	font-size:15px;
	float:left;
	position:absolute;
	top:20px;
	left: 25px;
}
.sticky-navigation-fixed {
    display:flex;
    justify-content:flex-end;
}


.social-media-footer {
	position: absolute;
    top: 20px;
    right:25px;
	display:flex;
	flex-direction: row;
	justify-content: center;
}
.social-media-footer li {
	margin:5px;
	list-style-type: none;
}
.social-media-footer li .fa {
	font-size:26px;
}

a {
	text-decoration:none!important;
}


/* -------------------------- Responsive -------------------------- */

/* -------------------------- Fonts -------------------------- */


@media screen and(max-width: 769px)
{
	.description h2 {
		font-size:14px;
		font-weight: bold;
		line-height: 18px;

	}

	.description p {
		font-size:12px;
	}

}

h1{
	font-size:35px;
	color:white;
	margin-bottom:10px;
}

/* -------------------------- Responsive -------------------------- */

/* -------------------------- Mobile portrait -------------------------- */

@media (max-width: 1050px)  {
	#app-2014 {display:none!important;}
}

@media (max-width: 770px)  {
	.prices {
		display:none!important;
	}
}

@media screen and (max-width: 420px)
{
	.recettes {
		display: flex;
	    flex-direction: column;
	    align-items: center;
	    padding-left: calc(50% - 112.5px);
	}
	.row {margin-right: 0px;margin-left: 0px;}

}

@media screen and (max-width: 420px) {
	.compagnon .description h2 {
	    font-size: 25px;
	    line-height: 26px;
	    margin-top: -49px;
	}
	.mascotte img {
	    width: 317px!important;
	    position: absolute;
	    left: calc(73% - 172.5px)!important;
	}
}


@media screen and (max-width: 490px)
{
	.verbatims {display:none;}
}

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


	.inspiration{
	display:flex;
	align-items: center;
	justify-content: space-between;
	}
	.connect h1 {
	width: 85%;
    margin-left: 7.5%;
    margin-right: 7.5%;
    margin-top: 15px;
}
.main-button {width:50%!important;}


.description p {font-size:13px!important;}

.red-logo {display:none;}


	.mascotte{
		left: calc(80% - 250px);
	}

	.landing {
	  margin:0;
	  padding:0;
	  background: url('/images/landing/background.png') no-repeat;
	  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
	  background-size: cover; /* version standardisée */
	  height: 100%;
	  display: block;
	}

	.signup{height:100%;}

	.members{
		width:100%;
		padding-right: 0!important;
		padding-left:0!important;
	}

	.connect{
		min-height:0;
		margin-top:0;
		height: calc(100vh - 65px); }
	.signup-connect{min-height: 580px;}

	.mascotte img, .visuelles-img img{
		width:100%;
	}

	ul.main-menu li {
    display: inline;
    padding:2px;
	}

	.bar {
    padding: 2% 0;
	}
	.bar img {
		width:150px;
		position:absolute;
		left:-1%;
		padding-top:2%;
	}
	.stores_links.col-sm-6.col-xs-6 {
		display:flex;
		justify-content: center;
	}
	.envies{
		display:flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	ul.main-menu {
	    line-height: 25px;
	}

	.inspiration{
		display:block;
		height:100%;
		padding: 0px;
		position: relative;
	}
	.members, .inspiration .description{display:inline-block;}


	.inspiration .description {
	    padding:0;
	    margin:0;
	    padding-top: 30px;
		padding-bottom:30px;
		width:76%;
		margin-left: 11.5%;
	}

	.visuelles-img{
		width:90%;
	}

	section{
		height:100%;
	}

	.prices img {
    	display:none;
	}

	.stores_links a img {
		width:145px!important;
    	height: auto;
	}

	.sticky-navigation-bottom{
		bottom:0;
		height:auto;
		position:relative;
	}


	.red-logo img {width:80px;}
	.logo-white {width:60px;}

	.compagnon .wrapper, .visuelles .wrapper{
		flex-direction:column;
		padding:20px;
	}



	.profile-pic {
		height:40px;
		width:40px;
		bottom:85%;
	}

	.visuelles .wrapper .description {
	    width: 95%;
	    margin-top: 5%;
	    margin-left:5%;
	}

	.recette{
		min-height:260px;
		width:225px;
		padding:5px;
	}
	#sticky-navigation {
		height:65px;
		box-shadow: 0 1px 5px 0 rgba(0,0,0,0.07),0 1px 0 0 rgba(0,0,0,0.03);
	}


	.envies .description {
		text-align:left;
		width: 67%;
	    padding-top: 35px;
	    padding-left: 0;
	    padding-left: calc(50% - 112.5px);

	}


	.recette-desc .titre {
		top:30px;
		margin:0 !important;
		font-weight:600!important;
		width:100%!important;

	}
	.profile .name {
    	font-size: 12px;
    	margin: 0 4px;
    	display: block;
    	left:35%!important;
		top:2%!important;

	}

	.titre h3 {
		color:black;
		font-size:15px;
		text-align:left;
	}


	.logos img {
		width:100%;
	}

	.logos {
		width:100%;
		padding-top:0;
		margin-left:0;
	}

	.verbatims{
		padding:20px;
	}
	footer {
		height:150px
	}

	footer img {
		position:absolute;
		left:0%;
		width:15%;
		left: calc(50% - 25px)!important;
		bottom: calc(35% - 25px);
	}
	footer p {
		position:absolute;
		font-size:.5em;
		bottom:5%;
		right:14%;
	}

	footer p, .footer .links {
		font-size:12px;
		margin-top: 20px;
	}

	footer {text-align :center;}

	.lang {display:none;}

	.main-menu li a{
		font-size:12px;
	}

	h2{
	   font-size:25px;
	   line-height:26px;
	}

	.sticky-navigation-fixed {
        display:flex;
        justify-content:center;
    }


	.desktop {display:none;}
	.mobile {display:block;}
	.compagnon .wrapper {width:100%;}

	.pic-logo .informations{display:none;}
	.inspiration{height:120%;}

	.informations p{
	padding:3px;
	text-align: left;
	color:white;
	font-size:12px;
	}

}

@media screen and (max-width: 700px) and (orientation:landscape) {
	.image-quoi {
		width:25%!important;
	}
	.envies {height:100%!important;}

}


@media screen and (max-width: 845px) {
	.compagnon .description {
		font-size:0.8em;
	}
	.visuelles-img img {
    width: 100%;
}
}
@media screen and (max-width: 880px) {
	.compagnon .description{
	    width: 85%!important;
	    font-size:1em;
	    z-index: 2;
	    text-align: left;
	}

	.mascotte img {
		width:345px;
		position:absolute;
		left:calc(63% - 172.5px);
	}

}
@media screen and (max-width: 1160px) {
	.compagnon .description {
	position: absolute;
    width: 40%;
    z-index: 2;
    line-height: 120%;
    margin-top: 0px;
    text-align: right;
    left:4%;
    right:58%;
    top: 61%;
	}

	.visuelles .wrapper .description {
    width: 95%;
    margin:5%;
	}
}

/* -------------------------- Mobile paysage -------------------------- */


@media (max-width: 599px) and (orientation:landscape) {

	.landing {
	  margin:0;
	  padding:0;
	  background: url('/images/landing/background.png') no-repeat;
	  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
	  background-size: cover; /* version standardisée */
	  height:100%;
	}

	.login{height:100%}


	.signup-connect{min-height: 400px;}

	.main-button {
    padding: 5px;
    font-size: 10px;
    cursor: pointer;
    margin-top: 5px;
    margin-bottom:5px;
	}

	h1{font-size:14px;}

	p.slogan {
		font-size:12px;
		font-family:"Avenir Regular";
	 }
	.description{
		font-size:12px;
	}
	section{
		height:100%;
	}

	.recettes {
    	width: 100%;
    	padding:0;
	}


	.sticky-navigation-fixed, {
		height:20px;
	}

	.sticky-navigation-bottom {
		position:relative;
	}

	.visuelles-img {
    	text-align: center;
    	width:60%;
	}
    .desktop {display:none;}
	.mobile {display:block;}
	#sticky-navigation {
    background-color: white;
    height:65px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 1% 1%;
    z-index: 10;
	}

	.lang {display:none;}



	.mascotte img{width:100%;}
	.compagnon .wrapper{width:100%;}
	.compagnon .description{
	width: 100%;
    z-index: 2;
    margin-top: 10px;
    text-align: right;
	}


	.envies {
    padding:10px;
	}

	.description h2 {line-height:16px;}

	.inspiration{height:120%;}

	.inspiration .description {
	    width: 100%;
	    padding:0;
	    margin:0;
	}


}

/* -------------------------- Nexus landscape -------------------------- */

@media (min-width: 600px) and (max-width: 1023px) and (orientation:landscape) {

	section{
		height:100%;
	}

    .desktop {display:none;}
	.mobile {display:block;}
	.visuelles .wrapper {display:block;}
	.visuelles-img{width:50%;margin:auto;}

.visuelles-img img {
    width: 100%;
}


}



/* -------------------------- Nexus portrait -------------------------- */

@media (min-width: 450px) and (max-width: 767px) and (orientation:portrait) {




	.signup{height:100%;}
	.signup-connect{min-height: 580px;}



	.lang {display:none;}

	.envies{flex-direction:column; padding:0;}



	.prices img {
    	display:none;
	}


	.visuelles .wrapper {display:block;}
	.visuelles-img{width:50%;margin:auto;}





}

/* -------------------------- Ipad portrait -------------------------- */

@media (min-width: 768px) and (max-width: 1024px) and (orientation:portrait) {



	.desktop {display:none;}
	.mobile {display:block;}

	.prices img {
    	display:none;
	}
	.visuelles{padding:0px 20px 20px 60px;}

	.visuelles .wrapper {display:block;}
	.visuelles-img{width:50%;margin:auto;}

	.visuelles .wrapper .description {
    width:100%;
    margin:0;
	}
}



/* -------------------------- Ipad landscape -------------------------- */



@media (min-width: 1024px) and (max-width: 1200px) and (orientation:landscape) {


	.landing {
	  margin:0;
	  padding:0;
	  background: url('/images/landing/background.png') no-repeat;
	  -webkit-background-size: cover; /* pour anciens Chrome et Safari */
	  background-size: cover; /* version standardisée */
	  height: 100%;
	  display: block;
	}

	.signup{height:100%;}

	.signup-connect{min-height: 580px;}
	.stores_links {float:right!important}

	.desktop {display:none;}
	.mobile {display:block;}

	.visuelles .wrapper .description {
    	width: 30%;
   		margin-top: -180px;
    	margin-left: 20px;
		}

	section{height:100%;}
	.landing{height:100vh;}

	.compagnon .wrapper {
		display:block;
		width:85%;
	}

	 .verbatims{flex-direction: column-reverse;}


	.logos{width:100%;padding:40px;	margin-left:0;}

	.compagnon .wrapper {width:100%; margin-bottom: 80px;}

	.mascotte{
		width:45%;
		margin-left:0;
		margin:auto;
	}
}


/* -------------------------- Large size -------------------------- */
@media screen and (max-width:1024px) {
	.youmiam-advertise {display:none;}
}

@media screen and (min-width:1400px) {

	section {
		height:100%;
	}

	.recette-desc{
		height:35%;
	}

  .login-button {
    padding: 0 20px;
    font-size: 12px;
}

@media screen and (min-width:1600px) {

	.recette-desc{
		height:35%;
	}

	body {
	line-height: 1;
	font-family:"Avenir regular";
	font-size:20px;
	}

	.connect {
    margin: auto;
    text-align: center;
}



}