/* Smartphones et tablettes ----------- */
@media only screen
and (min-width : 0px)
and (max-width : 1024px) {

	*{box-sizing:border-box;}
	input[type="text"], input[type="password"], input[type="email"], textarea{font-size:16px;border-radius:0;-webkit-appearance: none;-moz-appearance: none;appearance: none;min-width:1px!important;}
	body{width:100%;min-width:auto;overflow-x: hidden;}
	#fctmag_onglet, #fctblog_onglet{display:none;}
	#main {padding: 0 15px;min-height:1px;}
	.middle_content, header .middle_content, #main, footer #footer_content, header #menu, header #log_form{max-width:1020px;width:100%;}
	img{max-width: 100%}
	
	header{height:45px;}
	header #logo a { background: url(../img/logo-horizontal.svg) no-repeat; }
	header #table_cell_mini, header.mini #table_cell_mini {display: none}

	header #entete_mobile {display:block!important;position:relative;}
	header #logo, header.mini #logo {margin: 4px 10px;height: 45px;width: 170px;vertical-align: middle;}
	header .picto_header{position:absolute;right:10px;top:12px;}
	header #picto_menu_mobile {vertical-align: middle;display: inline-block;width:25px;height:15px;position:relative;cursor:pointer;}
	header #picto_menu_mobile .barre{position:absolute;background-color:#111;width:25px;height:2px;transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;-webkit-transition: all 0.3s ease;-ms-transition: all 0.3s ease;opacity:1;border-radius: 5px;}
	header #picto_menu_mobile .barre:nth-child(1){top:0px;}
	header #picto_menu_mobile .barre:nth-child(2){top:6px;}
	header #picto_menu_mobile .barre:nth-child(3){top:12px;}
	header.openMenu #picto_menu_mobile .barre:nth-child(1){transform:rotate(-46deg);-webkit-transform:rotate(-46deg);-moz-transform:rotate(-46deg);-ms-transform:rotate(-46deg);-o-transform:rotate(-46deg);left:2px;top:8px;}
	header.openMenu #picto_menu_mobile .barre:nth-child(3){transform:rotate(50deg);-webkit-transform:rotate(50deg);-moz-transform:rotate(50deg);-ms-transform:rotate(50deg);-o-transform:rotate(50deg);left:2px;top:8px;}
	header.openMenu #picto_menu_mobile .barre:nth-child(2){width:1px;opacity:0;height:1px;margin-left:15px;}
	header #menu_mobile {position: fixed;top: 45px;left: 100%;text-align: center;white-space:nowrap;transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;-webkit-transition: all 0.3s ease;-ms-transition: all 0.3s ease;font-size: 1em;}
	header.openMenu #menu_mobile{transform:translateX(-100%);-wekbit-transform:translateX(-100%);-moz-transform:translateX(-100%);-o-transform:translateX(-100%);-ms-transform:translateX(-100%);}
	header #menu_mobile ul li{display:block;background-color:#f2f2f2;color:#222;border-bottom:1px solid #E4E4E4;border-left:1px solid #E4E4E4;}
	header #menu_mobile ul li a{display:block;padding: 10px 20px; color:#222;}
	header #menu_mobile ul li.active{background-color:#E32354;}
	header #menu_mobile ul li.active a{font-weight: bold;color:#EEE;}

	#choix_langue {margin:0;}
	#choix_langue > dt > a {background-color:transparent;}
	#choix_langue dd{position:inherit;}
	#choix_langue dd ul {top:30px;right:135px;padding:0;}

	header .picto_header a {margin-right:10px;}
	header .picto_connexion{display: inline-block;width: 20px;height: 20px;background: url(../img/Spritecss.png) -180px 0 no-repeat;vertical-align: middle;}
	header #bloc_connexion{display:none;right:28px;top:48px;font-size:1em;}
	header #bloc_connexion form button{margin-bottom:15px;}

	
	header #navigation {padding-top: 5px;display: table-cell;}
	header #log_form {display: table-cell;position: relative;vertical-align: top;width: auto;margin-top: 2px;white-space: nowrap;}
	header #log_form > * {vertical-align: middle;}
	.dropdown dd ul{right:5px;left:auto;}
	header #picto_menu_mobile{display:inline-block!important;}
	header #menu , header.mini #menu{position:fixed;max-width: 80%;top:45px;right:0;margin:0;left:100%;}
	header.openMenu #menu{transform: translateX(-100%);-webkit-transform: translateX(-100%);-moz-transform: translateX(-100%);-o-transform: translateX(-100%);-ms-transform: translateX(-100%);}
	header #menu ul li {display:block;}


	/*.bloc_accueil_top .slogan{display:none;}*/
	.bloc_accueil_top, .bloc_concept_top, .bloc_contact_top{margin-top:45px;}
	#main .concept{padding:10px;}
	.bloc_noir_top{padding: 10px 5px;margin-top: 45px;font-size: 1.3em;}
	.bloc_noir_rose{padding: 10px 5px;font-size: 1em;}

	#main #test_produits, #main #coups_de_coeur{width:100%;float:none;padding:20px 0;}
	#produits_du_moment, #main #coups_de_coeur .coups_de_coeurs_produits {text-align: center;}
	#main #test_produits #produits_du_moment .produit, #main #coups_de_coeur .coups_de_coeurs_produits .produit{/*float:none;*/display:inline-block;width:100%;vertical-align: top;font-size:0.7rem;}
	#main #test_produits #produits_du_moment .produit:nth-last-child(1), #main #coups_de_coeur #coups_de_coeurs_produits .produit:nth-last-child(1){margin-bottom:30px;}
	#main .slick-prev{left:0;z-index: 3;}
	#main .slick-next{right:0;z-index: 3;}
	#main #fiche_produit .slick-prev{top:11rem;}
	#main #fiche_produit .slick-next{top:11rem;}
	#main #fiche_produit .slick-list .produit_droite .type_produit, #main #fiche_produit .produit_droite .nom_produit, #main #fiche_produit .produit_droite .prix_produit{font-size:1.15rem;}
	#main #fiche_produit .slick-list .produit_droite .description_produit{font-size:1rem}

	.produit .image_produit{border:1px solid #f1f1f3;}
	#main .concept_content{padding:0;}
	#main .concept_content #concept_etapes_boutique, #main .concept_content #concept_etapes_test_produits{width:100%;height:auto;}
	#main .concept_content #concept_etapes_boutique .barre_avancement, #main .concept_content #concept_etapes_test_produits .barre_avancement{display:none;}
	#main .concept_content #concept_etapes_boutique .etape, #main .concept_content #concept_etapes_test_produits .etape{padding:0;margin: 10px 0;}

	#main #fiche_produit{padding:5px;background-color:transparent;}
	#main #fiche_produit .produit_gauche{width:100%;max-width: 240px;margin:0 auto;float:none;}
	#main #fiche_produit .produit_droite{width:100%;float:none;margin-top:15px;}

	#main .table_derniers_testeurs{width:100%;}
	#main .table_derniers_testeurs .produit .gagnants .table_gagnants, #main .table_derniers_testeurs .table_gagnants, #main .table_derniers_testeurs .table_gagnants tr, #main .table_derniers_testeurs .table_gagnants th, #main .table_derniers_testeurs .table_gagnants td, #main .table_derniers_testeurs .table_gagnants thead, #main .table_derniers_testeurs .table_gagnants tbody {display:block;width:100%;}
	#main .table_derniers_testeurs .table_gagnants tr:nth-child(1){display:none;}
	#main .table_derniers_testeurs .produit .gagnants{text-align: center;}
	#main .table_derniers_testeurs .produit .gagnants .table_gagnants{border:1px solid #CCC;}
	#main .table_derniers_testeurs .produit .gagnants table tr:nth-child(2) td, #main .table_derniers_testeurs .produit .gagnants table td{border:none;}
	#main .table_derniers_testeurs .produit .gagnants table tr:nth-child(odd) td{background-color:transparent;}
	#main .table_derniers_testeurs .produit .gagnants table tr:nth-child(odd) {background-color:#EEE;}
	#main .table_derniers_testeurs .produit .gagnants table tr:nth-last-child(1) td {border:0;}

	#main .bloc_contact .texte_top{font-size:1.1em;}
	#main .bloc_contact .contact_form{width:100%;}
	#main .bloc_contact .contact_form form{max-width:400px;margin: 0 auto;}
	#main .bloc_contact .contact_form #sujet, #main .bloc_contact .contact_form input, #main .bloc_contact .contact_form textarea{width:100%;}

	#main #boutique_produits{text-align: center;}
	#main #boutique_tri {display:none;}
	#main #boutique_produits .produit{width:45%;margin:0 5px;float:none;display:inline-block;}
	#main #boutique_produits .produit .image_produit{height:auto;display:inline-block;}
	#main #boutique_produits .produit .image_produit img{max-width: 100%;}
	#main #boutique_produits .produit .image_produit .filtre_hover{display:none;}

	#main .bloc_mdp_oublie{padding:0px 0px 50px;font-size:1em;}
	#main .bloc_mdp_oublie .saisir_email, #main .bloc_nouveau_mdp .saisir_mdp{width:100%;font-size:1em;max-width: 750px;}
	#main .bloc_mdp_oublie .saisir_email input[name='email']{width:90%;}


	#main #questionnaires_profil .questionnaire {width:140px;vertical-align: top;}
	#main #questionnaires_profil .questionnaire .questionnaire_description .questionnaire_nom {min-height: 45px;line-height: 1.5;}
	#etudes_en_cours, #etudes_en_cours tr, #etudes_en_cours td, #etudes_en_cours tbody, #etudes_en_cours thead, #main #etudes_en_cours td, #main #etudes_en_cours th, #main #etudes_en_cours tr td:nth-child(2) {display:block;width:100%;border:0;padding:0;text-align: left;}
	#main .bloc_compte_profil .title_compte, #main .bloc_compte_points .title_compte{padding-top:20px;}
	#etudes_en_cours thead {display:none;}
	#main #etudes_en_cours tr td:nth-last-child(1){width:auto;text-align: center;margin-top:15px;}
	#etudes_en_cours tr {padding:10px 0 20px;border-bottom:1px solid #CCC;}
	#etudes_en_cours tr:nth-last-child(1) {border:0;}
	#main #etudes_en_cours tr td:before{content:attr(data-label);font-weight:bold;}
	#main #etudes_en_cours tr td{line-height:1.5em;}
	div#QDJ{width:100%!important;max-width:400px;}
	#modalites_QDJ {padding: 5px!important;min-height: 0!important;}

	#main .bloc_compte_profil {width:100%;float:none;padding:10px;border:0;}
	#main .bloc_compte_profil .simul_input, #main .bloc_compte_profil input[type="text"], #main .bloc_compte_profil input[type="email"], #main .bloc_compte_profil input[type="password"], #main .bloc_compte_profil #informations_profil .ligne_input #pays, #main .bloc_compte_profil .title_compte, #main .bloc_compte_points .title_compte{width:100%;}
	#main .bloc_compte_profil #informations_profil .picto_crayon{top:5px;right:-25px;}
	#main .bloc_compte_points {margin-top:20px;width:100%;float:none;padding:10px;border:0;}
	#main #tableau_etudes #etudes_btn{text-align: center;margin-bottom:10px;}
	#main #tableau_etudes #etudes_btn div{margin:2px;}

	#main #fiche_produit .produit_droite .boutons_produit span {margin:2px;}

	#commentaires_produit {margin-top:30px;border-top:1px solid #CCC;padding-top:20px;}
	
	#main .societe_content{padding:0;}
	#main .societe_content #liste_logos .logo .nb{opacity:0;}
	#main .societe_content #liste_logos .logo .couleurs{opacity:1;}
	#liste_logos br {display:none;}
	#main .societe_content #liste_logos .logo {margin:5px 20px;}
	#main .societe_content #chiffres_madeinsurveys br {display:none;}
	#main .societe_content #chiffres_madeinsurveys .border_cell{display:block;border-bottom:1px solid #CCC;padding: 10px;}
	#main .societe_content #chiffres_madeinsurveys .chiffre{width:auto;height:auto;background:transparent;font-size:1em;color:#111;display:block;width:100%;}
	#main .societe_content #chiffres_madeinsurveys .chiffre .valeur{display:inline-block;font-size: 1.15em;font-weight: bold;background: #E32354;color:white;padding:5px;border-radius:5px;margin-bottom:5px;}
	#main .societe_content #chiffres_madeinsurveys .chiffre .description .vertical_align{width:auto;height:auto;padding:0;font-size:1em;display:block;}
	#main .societe_content #chiffres_madeinsurveys .chiffre .description{opacity:1;position:relative;display: block;}
	#main .societe_content #chiffres_madeinsurveys .chiffre:hover{background:transparent;}
	#main .societe_content #chiffres_madeinsurveys .chiffre:hover .valeur{opacity: 1;}
	#main .societe_content #chiffres_madeinsurveys .border_cell:nth-last-child(1){border-bottom:0;}

	#liste_marques {text-align: center;}
	#main #liste_marques .marque{margin:10px 30px;}

}

/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-width : 320px)
and (max-width : 767px) {

	header #log_form a.connexion{display:block;width:20px;height:20px;overflow:hidden;}
	header #log_form #bloc_connexion{right:-15px;}
	footer #footer_content .col1, footer #footer_content .col2 {width:49%;margin-bottom: 15px;}
	footer #footer_content .col3{float:none;width:100%; margin-bottom: 15px;}
	footer #footer_content .col3 ul{display:table;width:100%;table-layout: fixed;}
	footer #footer_content .col3 li{display:table-cell;vertical-align: middle;}
	/*.bloc_accueil_top .middle_content{background:none;}*/
	footer #footer_content ul li{margin-left:0;text-align: center}
	/*.bloc_accueil_top #devenir_membre{margin:0 auto;}*/

	.bloc_accueil_top .middle_content {background: url(../img/free_cosmetic_testing_inscription.jpg) 25vw bottom no-repeat white;background-size:cover;}
	.bloc_accueil_top .slogan {display: block;align-self: flex-start;}
	.bloc_accueil_top .slogan span{font-size:1.5rem;}
	.bloc_accueil_top #devenir_membre{margin:0;justify-content:space-between;}
	#app_store_badges_banner{left:0;}

	#main #test_produits #produits_du_moment .produit, #main #coups_de_coeur .coups_de_coeurs_produits .produit {margin:0 10px 30px;}
	#main .description_concept, #main .lien_concept{display:block;padding:0;border:0;text-align: center;width:100%;}
	#main .lien_concept{padding-top:20px;}	
	#main .lien_concept .custom_pink_button{margin:0;}

	#main #content_bloc_faq #faq_gauche{display:none;}
	#main #content_bloc_faq #faq_droite{height:auto;padding:0;}

	#main .bloc_compte_points .produits_favoris .produit:nth-child(2) {display: none;}
	#main #test_produits #produits_du_moment .produit:nth-child(2), #main #coups_de_coeur .coups_de_coeurs_produits .produit:nth-child(2) {display: none;}

	#block_vote_produit, #popup_block_vote_produit{flex-direction:column;padding: 0.5rem;}
	#block_vote_produit .image img{border: 1px solid #e9ebee;}
	#popup_commentaire_produit {font-size:1rem;padding:0;}

	#app_store_badges_banner {max-width: 100%;position:relative;left:initial;top:initial;bottom:initial;}
	#app_store_badges_banner .content {border-radius:0;}
	#app_store_badges_footer .badge, #app_store_badges_banner .badge {max-width: 45%;}

	#main .bloc_contact .contact_form #messages_contact { max-height:300px;}

}

@media only screen and (min-width: 0px) and (max-width: 500px) {
	.bloc_accueil_top .middle_content {background: url(../img/free_cosmetic_testing_inscription.jpg) -5vw top no-repeat white;}
	.bloc_accueil_top #devenir_membre{margin:0 auto;}
	#register_btn{align-self:center;}
}

/* Tablettes (portrait and landscape) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px) {

	/*.bloc_accueil_top .middle_content {background: url(../img/free_cosmetic_testing_inscription.jpg) 0 0px no-repeat;background-size:cover;}
	.bloc_accueil_top #devenir_membre{background: rgba(0,0,0,0.7);}*/

	#main .table_derniers_testeurs .table_gagnants tr{display:inline-block;width:49%;}
	#main .table_derniers_testeurs .produit .gagnants table tr:nth-child(odd) {background-color:transparent;}
	#main .table_derniers_testeurs .produit .gagnants table tr:nth-child(4n) td, #main .table_derniers_testeurs .produit .gagnants table tr:nth-child(4n+1) td {background-color:#EEE;}

	#main #boutique_produits .produit {width:30%;}
}