*{
    margin : 0;
    box-sizing : border-box;
}

html,body { height: 100%;   }

body{ /**display table génial**/
    font-family: 'Roboto', sans-serif; 
  /** background: #eaeef0;*/
  position: relative;
  display: table;
  width: 100%; 
}

body::after {
  content: '';
  display: block;
   height:318px;
}
.all{
    width : 95%;
    margin: auto;
    background: white;
    position: relative;
    
   /** box-shadow: 0px 5px 34px -1px rgba(0,0,0,0.75);*/

}

/***tête****/
#header{
   
   display: flex;
   flex-direction: row;
   height : 225px;
  
}
.logo{
    
}
.logoimg1{
    margin-top : 5px;
}
.logoimg1 img{
    display:block;
    margin : auto;
}
.phrase1{
    margin-left : 10px;
    margin-right : 10px;
    font-family: 'PT Sans', sans-serif;
    font-size : 25px;
    font-weight : 900;
    text-align: center;
    letter-spacing: 2px;
    margin-bottom: 10px;
    color :#003449;
}
.phrase2{
    text-align : center;
    letter-spacing: 2px;
    margin-top : 3px;
   font-family: 'Mukta Malar', sans-serif;
    font-size : 23px;
    
    color :#003449;
}
.container-info1{
    flex-grow : 1;
}
.container-info2{
    display: flex;
    flex-flow: row wrap;
    background :#d9f9e1;
    height: 135px;
    
}
.adress{
 	
   display: flex;
   flex-direction : column;
   justify-content: center;
    flex-basis : 366.66px;
  
}
.inside{
    display: flex;
    flex-direction:  row;
    justify-content: center;
}
.locaux{
	margin-top : 30px;
}
.locaux1{
	margin-top : 22px;
}

.inside img{
    
    width : 38.8px;
    height : 38.8px;
}
.telephone{
   display: flex;
   flex-direction : column;
   justify-content: center;
   flex-basis : 366.66px;
}
.adr1{
	
    margin-left: 15px;
    color: #658f8f;
}
.tel1{
    font-size : 20px;
    color: #658f8f;
     margin-left: 15px;
    line-height: 38.8px; /* hauteur de ligne (identique) */
  white-space: nowrap; 
  
}
/****navigateur*****/

.newrdv{
	display : none;
}

#nav{
	background: #003449;
}

#respnav{
	display : none;
}

 /* Add a black background color to the top navigation */
.topnav {
    background-color: #003449;
    overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
}

/* Change the color of links on hover */
.topnav a:hover {
    background-color: #86f1a3;
    color: black;
}

/* Add an active class to highlight the current page */

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
    display: none;
} 

#nav ul{
    display : flex;
    flex-direction : row;

    list-style: none;
    
    text-align: center;
    
    padding: 0;
}
#nav ul li{
    
   flex-grow: 1;
 
  line-height: 57px; /* hauteur de ligne (identique) */
  white-space: nowrap; 

   
}
 ul a{
    text-decoration : none;
    color : #d9f9e1;
    transition: color 1s;
}
 ul a:hover{
    
    color : #86f1a3;
}
/****Fin de l'en-tête****/

/**deuxième conteneur***/

section.container-rdv1{  
    position : relative;
    
}
.mySlides-container{
    width : 60%;
}
.horaires{
	width : 60%;
}
.mySlides{
    position : relative;
   display: none;
}

.dot-container{
    text-align:center;
    margin: 10px 0 0 0;
}

.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}
.active {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 4s;
  animation-name: fade;
  animation-duration: 4s;
}

@-webkit-keyframes fade {
  from {opacity: .3} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .3} 
  to {opacity: 1}
}
.oublier{
    width : 320px;
    height : 50% ;
    background: #d5eef1;
    opacity: 0.7;
    position : absolute;
    left : 110px;
    bottom : 40px;
}
.oublier p{
     margin-left : 10px;
    margin-right : 10px;
    font-family: 'PT Sans', sans-serif;
    font-size : 23px;
    font-weight : 900;
    text-align: center;
    letter-spacing: 2px;
    margin-top: 60px;
    height : 50% ;
}
.slid_1{
    height: 420px;
}
.slid_1 img{
   width : 800px;
    height: 420px;
    vertical-align: middle;
    border-radius: 4px;
}
/****zone de timetable et rendez-vous***/

.timetable{
    position: absolute;
    top : 0;
    right : 0;
    width : 38.5%;
    height: 420px;
    color: #658f8f;
    display: flex;
    flex-flow: column nowrap;
    
}
.timetable h1{
    margin-top: 20px;
    margin-bottom: 10px;
    font-family: 'Mukta Malar', sans-serif;
    color :#003449;
    font-size : 23px;
    letter-spacing: 1px;
   text-align : center;
}

.timetable table{
    margin-left: 120px;
    width : 320px;
    margin-top: 40px;
}
td{
    padding: 7px;
    
}

.takerdv{
     flex-grow: 1;
     display: flex;
     border-top: 1px solid #003449;
    align-items: center;
    justify-content: space-around;
    transition : color 0.7s background 0.7s;
    color: #003449;
}
.takerdv a{  
   text-decoration: none;
   color: #003449;
   font-size : 20px;
   margin-right: 90px;
   letter-spacing: 2px;
}
.takerdv:hover{
     background: #d9f9e1;
     color : #01202c;
     
}

.takerdv img{
  margin-left: 33px;
} 
.newrdv {
	display : none;
}
.rdv2 {
	
	background: #A9A9A9;
	margin-left : 10px;
	border-radius : 2px;
	
}

/****zone de description***/
section.description{
   
    display : flex;
    line-height: 1.7;
}
.chir{
    margin: 20px;
   
    width: 50%;
   
}
.pourquoi{
    margin: 15px;
    margin-left: 20px;
    width: 50%;

    
   
}
.chir h1{
     margin-top: 20px;
    margin-bottom: 15px;
    font-family: 'Mukta Malar', sans-serif;
    color :#003449;
    font-size : 23px;
    letter-spacing: 1px;
   text-align : center;
}
.lieu{
    margin-bottom: 35px;
}
.pourquoi h1{
     margin-top: 20px;
    margin-bottom: 25px;
    font-family: 'Mukta Malar', sans-serif;
    color :#003449;
    font-size : 23px;
    letter-spacing: 1px;
   text-align : center;
}
.pourquoi ul{
   margin-top: 10px;
   margin-bottom: 15px;
    font-size : 16px;
   color :#658f8f;
   list-style: none;
   line-height: 2.1;

}
.intro-video {
    width: 100%;
    margin: auto;
    
}
.ifram{
	width :572px; 
	height :315px;
}
.list-type1{
   
    margin-top: 50px;
    margin-left: 20px;
    width:450px;

}

.list-type1 ol{
counter-reset: li;
list-style: none;
*list-style: decimal;
font-size: 18px;
font-family: 'Mukta Malar', sans-serif;
padding: 0;
margin-bottom: 4em;
}
.list-type1 ol ol{
margin: 0 0 0 2em;
}
.list-type1 li{
    margin-bottom: 10px;
}
.list-type1 li + p{
    margin-bottom: 25px;
     font-size : 16px;
   color :#658f8f;
   list-style: none;
   line-height: 2.1;
}
.list-type1 a{
position: relative;
display: block;
padding: .4em .4em .4em 2em;
*padding: .4em;
margin: .5em 0;
background: #658f8f;
color: #000;
text-decoration: none;
-moz-border-radius: .3em;
-webkit-border-radius: .3em;
border-radius: 10em;
transition: all .2s ease-in-out;
}

.list-type1 a:hover{
background: #d6d4d4;
text-decoration:none;
transform: scale(1.1);
}

.list-type1 a:before{
content: counter(li);
counter-increment: li;
position: absolute;
left: -1.3em;
top: 50%;
margin-top: -1.3em;
background:#003449;;
height: 2em;
width: 2em;
line-height: 2em;
border: .3em solid #fff;
text-align: center;
font-weight: bold;
-moz-border-radius: 2em;
-webkit-border-radius: 2em;
border-radius: 2em;
color:#FFF;
}

 /* Style the tab */
.tab {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
	
}

/* Style the buttons that are used to open the tab content */
.tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
	
    transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #003449;
color: white;
}

/* Create an active/current tablink class */
.tab button.active {
    background-color: #003449;
	color: white;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
}


/*******Footer*****/
#fo{
    width: 100%;
    height: 318px;
    position: absolute;
    bottom:0;
    
}
#footer{
    display: flex;
    justify-content: space-around;
    background: #003449;
    padding: 25px;
    line-height: 1.7;
   
}
.ret{
    color: #eaecef;
    flex-grow: 1;
}
.ret h2{
   letter-spacing: 1px;
   font-size: 17px;
}
.realadr{
    margin-left: 40px;
    color: #658f8f;
  
}
#footer ul{
    list-style-type: circle;
}   rio
#footer li{
    margin-top : 10px;
}
#footer li a{
    text-decoration: none;
    color: #658f8f;
}
#footer li a:hover{
    
    color : #86f1a3;
}
.copyright ul{
    padding: 25px;
    display: flex;
    list-style: none;
    
}
.copyright p{
    margin-right:  150px;
}
.copyright li{
    margin-right:  15px;

}
.copyright li a{
    text-decoration: none;
    color: #658f8f;
}
.copyright li a:hover{
    
    color : #2a11b9;
}

/***navigation bar*****/

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
 right : 0px;
  left: 0px;
  padding-bottom : 20px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  border-bottom: 3px solid #003449;
}
.column{
    margin : 2px 5px 0px 10px;
}
.column p{
    line-height: 2;
    text-align: left;
    color: #658f8f;
}
.column a{
    text-decoration: none;
    color : #003449;
}

.dropdown:hover .dropdown-content {
  display: flex;
  flex-flow : row wrap;
  justify-content: space-around;
  animation : animate-nav 0.6s;
}
.traitement1{
    padding-bottom:50px ;
}
@keyframes animate-nav{
    from{
        top: 220px;
       
    }
    to{
        top : 192px;
        
    }
}
/*****dropdown-sticky****/
.dropdown-content1 {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
 right : 0px;
  left: 0px;
  padding-bottom : 20px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  border-bottom: 3px solid #003449;
}


.dropdown:hover .dropdown-content1 {
  display: flex;
  flex-flow : row wrap;
  justify-content: space-around;
  animation : animate-nv 0.6s;
}

@keyframes animate-nv{
    from{
        top: 85px;
       
    }
    to{
        top : 56px;
        
    }
}
/***sticky navigation bar***/
.sticky {
    
  position: fixed;
  top: 0;
  justify-content: space-around;
  width : 100%;
  right: 0;
  z-index : 3;
}
.sticky + .content {
  padding-top: 60px;
}

/**container**/

.container-rdv{
	
	padding : 5px;
	width : 85%;
	margin : auto;
	margin : 0 40px 20px 0;
	
	
}
.dis_title1{
	margin-top: 10px;
	margin-bottom: 10px;
	text-transform: uppercase;
	font-family: 'Mukta Malar', sans-serif;
    color :#004d00;
    font-size : 30px;
    font-weight : bolder;
    letter-spacing: 2px;
}

.container-rdv p{
	
	font-family: 'Mukta Malar', sans-serif;
	color : #484848;
	margin-bottom: 15px;
}

.container-rdv h4{
	font-family: 'Mukta Malar', sans-serif;
	color : #484848;
	margin-top: 15px;
	margin-bottom: 15px;
}


.container-rdv li{
	font-family: 'Mukta Malar', sans-serif;
	color : #696969;
	margin-bottom: 10px;
}
.container-rdv img{
	margin-bottom : 15px;
}
/**myopie**/
.asking1{
	font-size : 22px;	
}
.asking2{
	color : #484848;
	font-size : 16px;	
}
/**traitement**/
.simple_souligné{
	text-decoration : underline;
}
.little_bigger{
	font-size : 20px;
}

.little_bigger2{
	font-size : 14px;
	color : #282828;
	margin-bottom: 5px;
}
.container_flex_avec_image{
	display: flex;
}
.minuscule{
	margin-top: 10px;
	font-size : 12.8px;
	font-style: italic;
}
.iframe{
	margin-left : 15px;
	
}
/**contact**/
input, select, textarea {
    width: 50%; /* Full width */
    padding: 12px; /* Some padding */ 
    border: 1px solid #ccc; /* Gray border */
    border-radius: 4px; /* Rounded borders */
    box-sizing: border-box; /* Make sure that padding and width stays in place */
    margin-top: 6px; /* Add a top margin */
    margin-bottom: 16px; /* Bottom margin */
    resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
    -webkit-transition: border 1s, color 1s; /* Safari */
    transition: border 1s, color 1s;
   
}
input[type=submit] {
    background-color: #003449;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    -webkit-transition: opacity 1s; /* Safari */
    transition: opacity 1s;
}
input:hover,select:hover,textarea:hover{
	border : 1.3px solid #001a00;
	color : #000033;}

input[type=submit]:hover {
    
    opacity : 0.85;
    border: none;
    color: white;
}
.dist{
	color : #003449;
	margin-top: 10px;
	margin-bottom: 10px;
	text-transform: uppercase;
	font-family: 'Mukta Malar', sans-serif;
    
    font-size : 30px;
    font-weight : bolder;
    letter-spacing: 2px;
}
.disty{
	font-size : 20px;
}
#form{
	width : 80%;
	margin : auto;
}

.bold{
	 font-weight : bolder;	
}
.num{
	font-size : 19px;

}

#medecin{
	margin : auto;
	width :25%;
}

#medecin img{
	border-radius : 50%;
}

#medecin p{
	font-size : 19px;
}
#full{
	
	display : flex;
}
.map2{
	
}