/********** MEDIA QUERIES POUR RESPONSIVE ******/

@media (max-width: 1650px) {

	#bloc_communaute, #bloc_panel {
		width: 60%;
		padding: 0 0 0 40%;
	}

	.bloc_sidebar .intertitre_bloc {
		width: 90%;
	}

}

@media (max-width: 1420px) {
	#page_compte main{
		width:75%;
	}


}

@media (max-width: 1366px) {
	#logo img {
		display: block;
		max-width: 160px;
	}

	#bloc_communaute, #bloc_panel {
		width: 65%;
		padding: 0 0 0 35%;
	}

	.bloc_sidebar .titre_bloc {
		margin: 25px 0 15px;
		font-size: 25px;
		line-height: 30px;
	}

	.bloc_sidebar .intertitre_bloc {
		font-size: 18px;
		width: 100%;
	}

}

@media (max-width: 1367px), handheld and (max-height: 770px) {
	#logo {
		height: 180px;
	}

	#logo img {
		padding: 10px 0;
	}

	#menu-toggle {
		height: 180px;
	}

	#bloc_communaute, #bloc_panel {
		height: 200px;
		width: 60%;
		padding: 0 0 0 40%;
	}
}

@media (max-width: 1157px) {
	.btn, .btn_fond_orange, .btn_fond_vert{
		padding: 4px 10px;
		font-size: 13px;
		margin:5px 0;
	}

	.infos_compte #gestion_animaux ul li span, .infos_compte #gestion_animaux #ajout_animal li span{
		height:60px;
		width:60px;
	}

	#infos_user span.photoProfil{
		height:60px;
		width:60px;
	}

	.titreCompte{
		font-size: 22px;
	}
}


@media (max-width: 1200px), handheld and (max-height: 768px) {

	#logo {
		height: 200px;
	}

	#bloc_panel {
		background-image: none;
		background-image: none, linear-gradient(to right, #00b5ca 50%, #016d6b 50%);
		background-image: none, -webkit-linear-gradient(to right, #00b5ca 50%, #016d6b 50%);
		background-image: none, -moz-linear-gradient(to right, #00b5ca 50%, #016d6b 50%);
	}

	#bloc_communaute {
		background-image: none;
		background-image: none, linear-gradient(to right, #dd6826 50%, #aa611d 50%);
		background-image: none, -webkit-linear-gradient(to right, #dd6826 50%, #aa611d 50%);
		background-image: none, -moz-linear-gradient(to right, #dd6826 50%, #aa611d 50%);
	}

	#bloc_communaute, #bloc_panel {
		width: 80%;
		padding: 0 0 0 20%;
	}

	.body-popup #page_contact {
		width: 55%;
	}

}


@media (max-height: 768px) {

	body {
		overflow: hidden;
	}



	/*
	header {
		overflow-y:auto;
		}
		*/
	.body-popup #page_contact {
		width: 55%;
	}

	/*AJOUT ANIMAL*/
	.ajout_animal #page_contact {
		width: 35% !important;
	}



}
@media (min-width: 786px) {
	.hideResponsive{
		display: block !important;
	}
}


@media (max-width: 1024px) {
	body header {
		height: 60px;
	}

	#header_bandeau {
		padding: 5px 0;
		box-sizing: border-box;
	}

	#header_logo,
	#header_logo img {
		height: 100%;
	}

	/**Menu Animation**/
	.menu_mobile {
		display: block;
		transition: 0.1s transform linear;
		position: relative;
		background: 0;
		height: 2rem;
		width: 120px;
		outline: 0;
		padding: 0;
		border: 0;
		z-index: 1001;
		cursor: pointer;
		font-size: 1rem;
	}

	.bar, .bar::before, .bar::after {
		transition: all 0.2s linear;
		position: absolute;
		background: #F39100;
		margin: auto;
		width: 2rem;
		height: 0.17rem;
		content: '';
		top: 50%;
		right: 0;
		border-radius: 100px;
		cursor: pointer;
	}
	.bar {
		margin-top: -0.2rem;
	}
	.bar::before {
		top: -0.55rem;
	}
	.bar::after {
		top: 0.55rem;
	}
	.bar::before, .bar::after {
		transform: rotate(0deg);
	}
	.active .bar {
		background: 0;
	}
	.active .bar::before {
		transform: rotate(45deg);
	}
	.active .bar::after {
		transform: rotate(-45deg);
	}
	.active .bar::before, .active .bar::after {
		top: 0;
	}
	.active .bar, .active .bar::before, .active .bar::after {
		transition: all 0.2s linear;
	}

	body #navMenu {
		width: 100%;
		height: 100% !important;
		background: #fff;
		position: fixed !important;
		top: 0;
		left: 0;
		z-index: 9;
		transform: translateX(-1024px);
		transition: transform 0.6s cubic-bezier(0.56, 0.1, 0.34, 0.91);
	}
	.menu-open #navMenu {
		transform: translateX(0);
	}

	#menu-deroulant {
		flex-direction: column;
		justify-content: center;
		height: 100%;
	}

	.text_menu {
		font-size: 25px;
		margin-top: 10%;
	}

	.navMenu ul li,
	.navMenu ul li:last-child {
		margin: 10px auto;
	}

	nav ul li a {
		font-size: 18px;
		padding: 5px 20px;
	}

	/***GENERAL***/
	#espace_membre main {
		margin: 0;
	}

	/***ACCUEIL***/
	.imgTopHome {

	}

	#bloc_communaute, #bloc_panel {
		width: 90%;
		padding: 0 0 0 10%;
	}

	.bloc_sidebar .titre_bloc {
		margin: 15px 0;
		font-size: 20px;
	}

	.bloc_sidebar .titre_bloc u {
		font-size: 20px;
	}

	.navigationCompte{
		width: 100%;
		bottom: 0;
		top: auto;
	}

	#page_compte main{
		overflow-y: initial;
		overflow-x:initial;
		height:auto;
	}

	.mesContrats_contrat{
		width: 46%;
	}


}

@media (max-width: 968px) {
	body .cc_container a, body .cc_container a:visited,
	body .cc_banner-wrapper .cc_container .cc_btn {
		max-width: 200px !important;
		width: 60%;
	}

	#logo img {
		padding: 5px 0;
	}

	/*GESTION COMPTE*/
	#page_compte main {
		width: 75%;
	}

}

@media (max-width: 1024px) {
	#menu {
		background: none;
	}

	#supersized{
		width: 100% !important;
	}

	header {
		height: auto;
	}

	#page_dynamique{
		width:100%;
	}

	.body-popup #page_contact, #page_contact{
		width: 100%;
	}

	/*portrait ipad*/

	.input__field {
		margin-right: 10px;
	}

	.menu-icon span::before {
		top: 16px;
	}

	#menu-toggle {
		min-height: auto;
	}

	body {
		overflow-x: hidden;
		overflow-y: visible;
	}

	body .no_tablette, body #logo .no_tablette {
		display: none;
	}

	body .tablette, .tablette, .phone, body #logo .tablette {
		display: block !important;
	}
	body .cc_banner-wrapper {
		bottom: 0;
		width: 100%;
	}

	body .cc_container a, body .cc_container a:visited, body .cc_banner-wrapper .cc_container .cc_btn {
		max-width: 110px !important;
		width: 40%;
	}

	footer {
		width: 100%;
	}

	a#logo {
		padding: 0;
		float: none;
		text-align: center;
		margin: 0px auto;
		width: 100%;
		height: 130px;
		z-index: -1;
		background: none;

	}

	#logo img {
		max-width: 300px;
		margin-top: 20px;
	}

	#menu-toggle {
		top: 0;
		width: 12%;
		left: 0;
		height: 150px;
		position: fixed;
	}

	#menu-toggle.open {
		left: 0;
		width: 40%;
		/* height: 50%; */
	}

	.text_menu{
		font-size: 16px;
	}

	.menu-icon{
		height:40px;
	}

	.menu-icon span::before, .menu-icon span::after, .menu-icon span{
		width:50px;
	}

	#menu-toggle{
		height:110px;
	}

	#header_content {
		height: auto;
		padding: 0;
	}



	#bloc_communaute, #bloc_panel {
		display: none;
	}

	#page_compte main {
		width: 100%;
	}

	ul.sm li {
		border-top: solid 1px white;
	}

	.img_partenaire {
		width: 25%;
	}

	.titre_partenaire, .texte_partenaire {
		width: 75%;
		float: none;
	}


	body .carousel-navigation li:hover .hover_effect, body .carousel-navigation li.active .hover_effect {
		display: none;
	}

	body .connected-carousels .carousel-stage {
		width: 50%;
	}

	.infos_compte #gestion_animaux #ajout_animal li,
	.infos_compte #gestion_animaux ul#liste_chat li form,
	.infos_compte #gestion_animaux ul#liste_chien li form,
	.infos_compte #gestion_animaux .lien_questionnaire {
		float: none;
		margin: 10px 0;
	}

	.mainCompte .page_dynamique_content{
		padding-top: 0;
	}

	.mainCompte{
		margin-bottom: 60px;
	}


}

@media (max-width: 785px) {
	body .cc_banner-wrapper {
		min-width: 0;
	}

	.lienCompte img {
		max-height: 25px;
	}

	.lienCompte span {
		font-size: 9px;
	}


	.plusResponsive{
		display: block;
		padding: 8px 0 4px;
	}



	.plusResponsiveLien span{
		padding: 0;
		font-size: 30px;
	}

	.plusMoinsCompte{
		border: 2px solid #FFFFFF;
		border-radius: 50%;
		padding: 0;
		width:35px;
		height: 35px;

	}

	.hideResponsive{
		display: none;
	}

	.hideResponsive .liCompte{
		width: 16%;
	}

	.infos_compte #gestion_animaux ul li div{
		text-align: center;
	}
}

@media (max-width: 700px) {
	.mesContrats_contrat {
		width: 96%;
	}

	.signerContrat-lienPopup{
		display: block;
	}
}

@media (max-width: 690px) {
	#page_compte main h3{
		font-size: 18px;
	}
	.titreCompte{
		font-size: 20px;
	}

	.infosUser{
		text-align: center;
	}

	.profilModif{
		float: none;
	}

	.nomQuestionnaire{
		font-size: 15px;
	}
}

@media (max-width: 568px) {
	#logo img {
		margin-left: 140px;
	}

	nav ul li a {
		font-size: 15px;
		padding: 5px;
	}

	body .texte_article {
		float: none;
		width: 95%;
		border: none;
	}

	body .texte_article {
		width: 90%;
	}

	body .texte_partenaire {
		width: 98%;
	}

	#carousel_projet li {
		width: 10%;
	}

	body .texte_index {
		width: 95%;
		text-align: left;
	}

	.page_dynamique_content {
		margin: 0 auto;
		max-width: 100%;
		/*width: 99%;*/
	}

	.page_dyn_article_content {
		width: auto;
	}


	.image_droite, .image_gauche, .page_kiddle .infos_compte .photoactu_grd {
		float: none;
		text-align: center;
		border: none;
		max-width: 100%;
	}

	#page_compte header, .page_kiddle header {
		/*height: 200px;*/
	}

}

@media (max-width: 530px) {
	.hideResponsive .liCompte{
		width: 33%;
	}
}

@media (max-width: 440px) {

	#menu-toggle {
		width: 24%;
		height: 75px;
	}

	.menu-icon span, .menu-icon span::before, .menu-icon span::after {
		width: 55px;
	}

	.text_menu {
		display: none;
	}

	a#logo {
		margin: 2px auto 0;
		width: 75%;
		height: 73px;
		float: right;
	}

	#logo img {
		max-width: 300px;
		margin-left: 0;
		margin: 0px auto 0;
		/*width:95%;*/
		max-height: 72px;
		padding: 0px;

	}

	.menu-icon {
		margin: -10px auto 0;
	}

	#menu.open, #menu-deroulant {
		top: 8px;
	}

	#menu-toggle.open {
		width: 70%;
	}

	#carousel_projet {
		width: 75%;
	}

	#carousel_projet li a {
		width: 50%;

	}

	#header_content {
		padding: 0;
		margin: 0;
	}

	.phone {
		display: block !important;
	}

	.img_partenaire {
		display: block;
		float: none;
		/* height: 80px; */
		text-align: left;
		width: 100%;
		margin: 0 auto;
		text-align: center;
	}

	/*********** MENU ***********/
	ul#menu-deroulant ul.sm {
		overflow: hidden;
		padding-left: 0px !important;
		padding-right: 0px !important;
	}

	main .bloc_home {
		float: none;
		width: 95%;
		margin: 0 auto;
	}


	body .text_champ img, .texte_index img {
		margin: 0 auto;
		float: none;
		height: auto;
	}

	body .text_champ p {
		text-align: left;
	}

	.une-actu {
		float: none;
		height: auto;
	}

	/*********** CAROUSEL  **************/
	.wrap_carousel {
		height: 150px;
	}

	body .connected-carousels .navigation,
	body .connected-carousels .carousel-stage {
		border-right: none;
		float: none;
		margin: 15px auto;
		width: 90%;
		max-width: 340px;
	}

	body .connected-carousels .carousel-stage {
		height: 320px;
		margin-bottom: 0;
		padding-bottom: 0;
	}

	body .connected-carousels .carousel-stage li {
		height: 300px;
	}

	body .connected-carousels .carousel-stage li img {
		max-width: 320px;
		height: auto;
	}



	.body-popup .page_dynamique_content {
		margin: 0 auto;
	}




	.body-popup .input__label--yoshiko {
		bottom: 70%;
	}

	.page_kiddle .wrap_carousel {
		display: none;
	}

}

@media (max-width: 385px) {
	a#logo{
		float: none;
		height:auto;
		width: 100%;
		margin: 56px auto 0;
	}

	svg#logo_anim{
		max-width: 100%;
		width:100%;
	}

	#logo img{
		max-width: 230px;
	}
	.menu-icon span,
	.menu-icon span::before,
	.menu-icon span::after{
		width:33px;

	}

	.menu-icon span{
		left: 32%;
		top:53%;
	}

	#menu-toggle {
		width: 20%;
		height: 50px;
	}

	.menu-icon{
		height: 50px;
	}

	.reunion{
		padding: 0 20px 20px;
	}

	.infosAnimaux,
	.infosUser{
		padding: 0 20px;
	}

	#infos_user p{
		text-align: center;
	}

	.infos_compte #gestion_animaux ul li input[type="submit"],
	.infos_compte #gestion_animaux ul li input[type="submit"]:hover{
		background: none;
		padding: 5px;
	}

	.infos_compte #gestion_animaux ul#liste_chat li form, .infos_compte #gestion_animaux ul#liste_chien li form{
		width:100%;
	}
}