@charset "utf-8";



.navigation_mobile_wrapper {
	display: none;
}



/* ecrans de PC de taille moyenne */
@media only screen and (min-device-width : 1024px) and (max-device-width : 1224px)  {



}

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

	.paragraphe_inner {
		min-width: 740px;
		max-width: 740px;		
	}
	

}

@media only screen and (max-device-width : 1200px)   {
	
	.paragraphe_inner {
		min-width: 640px;
		max-width: 640px;		
	}	
	
	nav.navigation_desktop {	
		width: 100%;
	}

	.menus {
		float: none;
		width: 100%;
		padding-top: 0px;
	}
	
	.menu_langues ul:after, .menu_principal ul:after, .menu_vetos ul:after,
	.menu_principal:after, .menu_vetos:after, .menu_langues:after{
		clear: both;
		content: "";
		display: block;
		
	}
	
	.menu_principal, .menu_vetos, .menu_langues {
		float: none;
		width: 100%;
	}
	.menu_langues ul {
		float: right;
	}		
	
	.menu_principal::before {
		display: none;
	}
	
	.menu_principal ul {	
		float: none;	
	}	
	
}

@media only screen and (max-device-width : 1023px)   {
	#navigation_wrapper {
		display: none; /* masquer le menu desktop */
	}
	.navigation_mobile_wrapper {
		display: block;
		position: fixed;
		width: 100%;
		z-index: 100;
		height: 55px;	
		background-color: #fff;	
		
	}
	
	.navigation_mobile_wrapper nav {
		padding: 20px;
		/*padding-top: 55px;
		background-color: #fff;	*/
		background-image: url(../images/fond-blanc-biseau-gauche.svg);
		background-repeat: no-repeat;
		background-size: cover;
		top: 55px;
		right: -100%;
		position: absolute;
		width: 80%;
	}
	
	.navigation_mobile_wrapper nav ul {
		width: 40%;
		float: right;
	}
	.navigation_mobile_wrapper nav li a {
		display: block;
		padding: 5px;	
		text-transform: uppercase;
		text-align: right;
		color: #244952; /* bleu petrole */	
	}
	
	.navigation_mobile_wrapper nav li.active a {
		font-weight: bold;
		color: #c0003f;
	}

	.navigation_mobile_bar {  padding: 0 0; height: 100%; }
	
	.navigation_mobile_bar:after {
		clear: both;
		content: "";
		display: block;	
	}
	
	.logo_mobile { 
		width: auto; 
		height: 40px; 
		margin-top: 10px;
		margin-left: 10px;
	}

	.logo_mobile, .titre_mobile {
		float: left;
	}
	
	.titre_mobile {
		padding-left: 10px;	
		padding-top: 10px;
		
	}
	
	.titre_mobile h1 {
		font-size: 60%;
		line-height: 1;
		color: #244952; /* bleu petrole */	
	}
	
	.titre_mobile img {
		height: 38px; 
		width: auto;
	}
	.hamburger{ 		 
		/*font-size: 250%; 
		color: #fff;
		padding: 8px; */
		height: 25px;
		width: auto;
	}	
	.hamburger_wrapper {
		height: 100%;
		float: right;
		background-color: #244952; /* bleu petrole */	
		position: relative;
		padding: 15px 10px;
	}
	
	.hamburger_pre_wrapper {
		float: right;
		 display : inline-block;
		 height : 0;
		 width : 0;
		 border-bottom : 55px solid #244952;
		 border-left : 35px solid transparent;	
	}
	#menu_accessoire .form_row, #mots_cles {
		width: 100%;	
	}
	
	.bloc {
		width: 100%;	
	}

}

@media only screen and (max-device-width : 800px)   {
	
	html {
		background-image: url(../images/photos_header/fond-instruments-chirurgie.jpg);
		background-size: auto 100%;
	}
	
	

	
	#contenu {
		padding-bottom: 100px; /* hauteur du pied de page (footer) */
	}
	
	.bloc-wrapper {	   
    	padding: 0px 0px; 
	}
	.intro_wrapper {
		padding: 0px 0px;
		padding-top: 80px;
	}	
	.intro_wrapper .bloc {
		padding: 0px 0px;
	}


	
	.accroche {
		text-align: center;	
		padding-bottom: 20px;
	}
	
	.intro {
		background-image: none;
		background-color: rgba(36, 73, 82, 0.8); 
		text-align: center;	
	}

	.paragraphe {
		width: 100%;
		position: static;
		padding: 20px;
	}	
	
	.paragraphe_inner {
		min-width: 100%;
		max-width: 100%;
	}
	
	.paragraphe.biseau_gauche {
		padding-left: 20px;
	}
	
	.paragraphe.biseau_droite {
		padding-right: 20px;
	}
	
	.paragraphe.biseau_gauche, .paragraphe.biseau_droite {
    	background-image: none;
		background-color: #fff;
	}
	
	.paragraphe_image.gauche, .paragraphe_image.droite {
    	width: 100%;
		position: static;
	}
	
	.paragraphe.biographie, .bloc.domaines_competence_wrapper, .biographie_wrapper {
		height: auto;	
	}	
	
	.paragraphe.biseau_droite .paragraphe_inner {
		float: none;
	}
	
	.domaine_competences .image {
		height: 240px;
	}	
	
	.domaine_competences .lien::before {
	
		left: -20%;
		width: 70px;
	
	}	
	
	.column1-2:nth-child(odd) .domaine_competences {
		padding-right: 0px;
	}	
	.column1-2:nth-child(even) .domaine_competences {
		padding-left: 0px;
	}	
		
	.bouton.rouge.right, .bouton.orange.right  {
		float: none;
		margin: 0 auto;	
	}
	
	.formation_wrapper {
		height: auto;	
	}
	
	.formation_inner {
		position: static; 
	}
	
	.dicovet {
		position: relative; 
		height: auto;
	}	
	
	.dicovet .paragraphe_image {
		height: 200px;
	}
	
	.bloc.titre_article {
		padding: 70px 10px 20px 10px;
	}
	
	.fond_cv {
		background-image: none;
	}
	
	.fond_cv .form_row	{
		padding: 5px 0;
	}
	
	.presentation_biographie {
		height: auto;	
	}
	
	.cv_item {
    	float: none;
    	width: 100%;
	}
	
	.form_row input[id=souvenir], .form_row input[id=consentement]{
		width: auto;
	}
	

	.desktop-only {
		position:static;	
		display: none;
	}	
	
}

@media only screen and (max-device-width : 600px)   {
	
	#contenu {
		padding-bottom: 50px; /* hauteur du pied de page (footer) */
	}

	.navigation_mobile_wrapper nav ul {
		width: 100%;
		float: none;
	}
	
	#form_connexion .bouton, #form_inscription .bouton, #contact_form .bouton {
		width: 85%;
		float: none;
		margin: 0px auto;
		display: block;		
	}
	
	#form_connexion .bouton::before, #form_inscription .bouton::before, #contact_form .bouton::before {
    	left: -5%;
	}
	#form_connexion .bouton::after, #form_inscription .bouton::after, #contact_form .bouton::after {
    	right: -5%;
	}	
	
	
	footer {
		position: relative;	
	}
	
	.domaine_competences .libelle {
    	top: -70px;	
		width: 80%;
	}
	
	.domaine_competences .lien {
		background-color: #c0003f;
		color: #fff;
		text-align: right;
		transition: 0.5s all;
		width: 50%;
		top: 0px;
		right: 0px;
	}		
	
}

@media only screen and (max-device-width : 480px)   {
	
	#contenu {
		padding-bottom: 30px; /* hauteur du pied de page (footer) */
	}	
	
	.mobile-only {
		display: block;	
	}	
	
	article img {
		width: 100%;
		height: auto;
	}

}

