@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Raleway);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);
@import url(http://fonts.googleapis.com/css?family=Droid+Serif); /* to import google font style UPDATE FORM*/ 

@charset "utf-8";
/* CSS Document */
/**************************************************
https://www.w3schools.com/howto/howto_js_responsive_navbar_dropdown.asp
https://www.w3schools.com/howto/howto_css_navbar_icon.asp
*/


/* Add a black background color to the top navigation  background-color: #848484; */
.montopnav {
 
  overflow: hidden;
 background: #8E8E8E;
  background: -o-linear-gradient(top, #848484, #5F5E5E);
  background: -ms-linear-gradient(top, #848484, #5F5E5E);
  background: -webkit-linear-gradient(top, #848484, #5F5E5E);
  background: -moz-linear-gradient(top, #848484, #5F5E5E);
  background: linear-gradient(to bottom, #848484, #5F5E5E);
  box-shadow: inset 0 -3px 0 #414141, inset 0 -3px 3px #4A4949, inset 0 2px 2px #f2f2f2, inset 1px 0 2px #c3c3c3, inset -1px 0 2px #c3c3c3, 0 1px 1px rgba(0, 0, 0, 0.1), 0 2px 2px rgba(0, 0, 0, 0.06), 0 3px 3px rgba(0, 0, 0, 0.17), 2px 1px 2px rgba(0, 0, 0, 0.05), -2px 1px 2px rgba(0, 0, 0, 0.05);
}

/* Style the links inside the navigation bar */
.montopnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
   padding: 13px 15px;
  text-decoration: none;
  font-size: 12px;

}

/* Add an active class to highlight the current page */
.active {
  background-color: #FFD966;
  color: white;
}

/* Hide the link that should open and close the montopnav on small screens */
.montopnav .icon {
  display: none;
}

/* mondropdown container - needed to position the mondropdown content */
.mondropdown {
  float: left;
  overflow: hidden;

}

/* Style the mondropdown button to fit inside the montopnav */
.mondropdown .mondropbtn {
  font-size: 12px; 
  border: none;
  outline: none;
  color: white;
  padding: 13px 15px;
 background: #8E8E8E;
  background: -o-linear-gradient(top, #848484, #5F5E5E);
  background: -ms-linear-gradient(top, #848484, #5F5E5E);
  background: -webkit-linear-gradient(top, #848484, #5F5E5E);
  background: -moz-linear-gradient(top, #848484, #5F5E5E);
  background: linear-gradient(to bottom, #848484, #5F5E5E);
  box-shadow: inset 0 -3px 0 #414141, inset 0 -3px 3px #4A4949, inset 0 2px 2px #f2f2f2, inset 1px 0 2px #c3c3c3, inset -1px 0 2px #c3c3c3, 0 1px 1px rgba(0, 0, 0, 0.1), 0 2px 2px rgba(0, 0, 0, 0.06), 0 3px 3px rgba(0, 0, 0, 0.17), 2px 1px 2px rgba(0, 0, 0, 0.05), -2px 1px 2px rgba(0, 0, 0, 0.05);
  
  font-family: inherit;
  margin: 0;
}

/* Style the mondropdown content (hidden by default) */
.mondropdown-content {
  display: none;
  position: absolute;
 background: #8E8E8E;
 
  background: -o-linear-gradient(top, #848484, #5F5E5E);
  background: -ms-linear-gradient(top, #848484, #5F5E5E);
  background: -webkit-linear-gradient(top, #848484, #5F5E5E);
  background: -moz-linear-gradient(top, #848484, #5F5E5E);
  background: linear-gradient(to bottom, #848484, #5F5E5E);
  box-shadow: inset 0 -3px 0 #414141, inset 0 -3px 3px #4A4949, inset 0 2px 2px #f2f2f2, inset 1px 0 2px #c3c3c3, inset -1px 0 2px #c3c3c3, 0 1px 1px rgba(0, 0, 0, 0.1), 0 2px 2px rgba(0, 0, 0, 0.06), 0 3px 3px rgba(0, 0, 0, 0.17), 2px 1px 2px rgba(0, 0, 0, 0.05), -2px 1px 2px rgba(0, 0, 0, 0.05);
  
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Style the links inside the mondropdown */
.mondropdown-content a {
  float: none;
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Add a dark background on montopnav links and the mondropdown button on hover */
.montopnav a:hover, .mondropdown:hover .mondropbtn {
  background-color: #9900CC;
  color: white;
}

/* Add a grey background to mondropdown links on hover */
.mondropdown-content a:hover {
  background-color: #9900CC;
  color: white;
}

/* Show the mondropdown menu when the user moves the mouse over the mondropdown button */
.mondropdown:hover .mondropdown-content {
  display: block;
}
/*phone
/////////////////////////////////////////*/
/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the montopnav (.icon) */
@media screen and (max-width: 600px) {
  .montopnav a:not(:first-child), .mondropdown .mondropbtn {
    display: none;
  }
  .montopnav a.icon {
    float: right;
    display: block;
  }
}

/* The "responsive" class is added to the montopnav with JavaScript when the user clicks on the icon. This class makes the montopnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 600px) {
  .montopnav.responsive {position: relative;}
  .montopnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .montopnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .montopnav.responsive .mondropdown {float: none;}
  .montopnav.responsive .mondropdown-content {position: relative;}
  .montopnav.responsive .mondropdown .mondropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
}

/*ipad
/////////////////////////////////////////*/
/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the montopnav (.icon) */
@media screen and (max-width: 1024px) {
  .montopnav a:not(:first-child), .mondropdown .mondropbtn {
    display: none;
  }
  .montopnav a.icon {
    float: right;
    display: block;
  }
}

/* The "responsive" class is added to the montopnav with JavaScript when the user clicks on the icon. This class makes the montopnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 1024px) {
  .montopnav.responsive {position: relative;}
  .montopnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .montopnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .montopnav.responsive .mondropdown {float: none;}
  .montopnav.responsive .mondropdown-content {position: relative;}
  .montopnav.responsive .mondropdown .mondropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
}

/*galaxy max-width: 1280px
/////////////////////////////////////////*/

/***************************************************/

/*	##########################################################################################
*	MENU BAR 2
*	##########################################################################################
*/


html {
   height: 100%;
}

body {
   min-height: 100%;
   padding-top: 120px; /* This should be equal to the height of your header */

}
}

 .block {   
       overflow:hidden;  
             
        }  
     

.err
{
	font-family : "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	font-size : 12px;
	color: red;
}


/* select styles*/
ol.date_select{
	margin: 0;
	padding: 0;
	list-style: none;
	display: inline;
}

/*table*/
table {
    border-collapse: collapse;
    width: 100%;
}

table thead th {
border: 1px solid black;
background-color: #ffffff;
color: #B45F04;
text-align: center;
}

table tbody td {
	border: 1px solid black;
	vertical-align: middle;
	padding: 15px;
	text-align: left;
}


mark {
    background-color: #E2FAAA;
    color: black;
}

/*NEW*/

.btn-red {
    color: #f8f8f8;
    background-color: #F34235;
    border-color: #c3352b;
}
.btn-red:hover {
    color: #fff;
    background-color: #c3352b;
    border-color: #c3352b;
}
.btn-lred {
    color: #F34235;
    background-color: transparent;
    border-color: #F34235;
}
.btn-lred:hover {
    color: #fff;
    background-color: #F34235;
    border-color: #F34235;
}


.btn-pink {
    color: #f8f8f8;
    background-color: #E81D62;
    border-color: #c51954;
}
.btn-pink:hover {
    color: #fff;
    background-color: #c51954;
    border-color: #c51954;
}
.btn-lpink {
    color: #E81D62;
    background-color: transparent;
    border-color: #c51954;
}
.btn-lpink:hover {
    color: #fff;
    background-color: #E81D62;
    border-color: #E81D62;
}


.btn-purple {
    color: #f8f8f8;
    background-color: #9B26AF;
    border-color: #89219b;
}
.btn-purple:hover {
    color: #fff;
    background-color: #89219b;
    border-color: #89219b;
}
.btn-lpurple {
    color: #9B26AF;
    background-color: transparent;
    border-color: #9B26AF;
}
.btn-lpurple:hover {
    color: #fff;
    background-color: #9B26AF;
    border-color: #9B26AF;
}


.btn-deep-purple {
    color: #f8f8f8;
    background-color: #6639B6;
    border-color: #5e35a8;
}
.btn-deep-purple:hover {
    color: #fff;
    background-color: #5e35a8;
    border-color: #5e35a8;
}
.btn-ldeep-purple {
    color: #6639B6;
    background-color: transparent;
    border-color: #6639B6;
}
.btn-ldeep-purple:hover {
    color: #fff;
    background-color: #6639B6;
    border-color: #6639B6;
}


.btn-indigo {
    color: #f8f8f8;
    background-color: #3E50B4;
    border-color: #3949a2;
}
.btn-indigo:hover {
    color: #fff;
    background-color: #3949a2;
    border-color: #3949a2;
}
.btn-lindigo {
    color: #3E50B4;
    background-color: transparent;
    border-color: #3E50B4;
}
.btn-lindigo:hover {
    color: #fff;
    background-color: #3E50B4;
    border-color: #3E50B4;
}


.btn-blue {
    color: #f8f8f8;
    background-color: #2095F2;
    border-color: #1a80d1;
}
.btn-blue:hover {
    color: #fff;
    background-color: #1a80d1;
    border-color: #1a80d1;
}
.btn-lblue {
    color: #2095F2;
    background-color: transparent;
    border-color: #2095F2;
}
.btn-lblue:hover {
    color: #fff;
    background-color: #2095F2;
    border-color: #2095F2;
}


.btn-light-blue {
    color: #f8f8f8;
    background-color: #02A8F3;
    border-color: #0396d8;
}
.btn-light-blue:hover {
    color: #fff;
    background-color: #0396d8;
    border-color: #0396d8;
}
.btn-llight-blue {
    color: #02A8F3;
    background-color: transparent;
    border-color: #02A8F3;
}
.btn-llight-blue:hover {
    color: #fff;
    background-color: #02A8F3;
    border-color: #02A8F3;
}


.btn-cyan {
    color: #f8f8f8;
    background-color: #00BBD3;
    border-color: #009fb3;
}
.btn-cyan:hover {
    color: #fff;
    background-color: #009fb3;
    border-color: #009fb3;
}
.btn-lcyan {
    color: #00BBD3;
    background-color: transparent;
    border-color: #00BBD3;
}
.btn-lcyan:hover {
    color: #fff;
    background-color: #00BBD3;
    border-color: #00BBD3;
}


.btn-teal {
    color: #f8f8f8;
    background-color: #009587;
    border-color: #018175;
}
.btn-teal:hover {
    color: #fff;
    background-color: #018175;
    border-color: #018175;
}
.btn-lteal {
    color: #009587;
    background-color: transparent;
    border-color: #009587;
}
.btn-lteal:hover {
    color: #fff;
    background-color: #009587;
    border-color: #009587;
}


.btn-green {
    color: #f8f8f8;
    background-color: #4BAE4F;
    border-color: #449d47;
}
.btn-green:hover {
    color: #fff;
    background-color: #449d47;
    border-color: #449d47;
}
.btn-lgreen {
    color: #4BAE4F;
    background-color: transparent;
    border-color: #4BAE4F;
}
.btn-lgreen:hover {
    color: #fff;
    background-color: #4BAE4F;
    border-color: #4BAE4F;
}



.btn-light-green {
    color: #f8f8f8;
    background-color: #8AC249;
    border-color: #78a83f;
}
.btn-light-green:hover {
    color: #fff;
    background-color: #78a83f;
    border-color: #78a83f;
}
.btn-llight-green {
    color: #8AC249;
    background-color: transparent;
    border-color: #8AC249;
}
.btn-llight-green:hover {
    color: #fff;
    background-color: #8AC249;
    border-color: #8AC249;
}


.btn-lime {
    color: #f8f8f8;
    background-color: #CCDB38;
    border-color: #bbc933;
}
.btn-lime:hover {
    color: #fff;
    background-color: #bbc933;
    border-color: #bbc933;
}
.btn-llime {
    color: #CCDB38;
    background-color: transparent;
    border-color: #CCDB38;
}
.btn-llime:hover {
    color: #fff;
    background-color: #CCDB38;
    border-color: #CCDB38;
}


.btn-yellow {
    color: #f8f8f8;
    background-color: #FEEA3A;
    border-color: #e4d235;
}
.btn-yellow:hover {
    color: #fff;
    background-color: #e4d235;
    border-color: #e4d235;
}
.btn-lyellow {
    color: #FEEA3A;
    background-color: transparent;
    border-color: #FEEA3A;
}
.btn-lyellow:hover {
    color: #fff;
    background-color: #FEEA3A;
    border-color: #FEEA3A;
}


.btn-amber {
    color: #f8f8f8;
    background-color: #FEC006;
    border-color: #e1aa05;
}
.btn-amber:hover {
    color: #fff;
    background-color: #e1aa05;
    border-color: #e1aa05;
}
.btn-lamber {
    color: #FEC006;
    background-color: transparent;
    border-color: #FEC006;
}
.btn-lamber:hover {
    color: #fff;
    background-color: #FEC006;
    border-color: #FEC006;
}


.btn-orange {
    color: #f8f8f8;
    background-color: #FFD966;
    border-color: #e78a01;
}
.btn-orange:hover {
    color: #fff;
    background-color: #e78a01;
    border-color: #e78a01;
}
.btn-lorange {
    color: #FFD966;
    background-color: transparent;
    border-color: #FFD966;
}
.btn-lorange:hover {
    color: #fff;
    background-color: #FFD966;
    border-color: #FFD966;
}


.btn-deep-orange {
    color: #f8f8f8;
    background-color: #FE5621;
    border-color: #d4481c;
}
.btn-deep-orange:hover {
    color: #fff;
    background-color: #d4481c;
    border-color: #d4481c;
}
.btn-ldeep-orange {
    color: #FE5621;
    background-color: transparent;
    border-color: #FE5621;
}
.btn-ldeep-orange:hover {
    color: #fff;
    background-color: #FE5621;
    border-color: #FE5621;
}


.btn-brown {
    color: #f8f8f8;
    background-color: #785447;
    border-color: #65463b;
}
.btn-brown:hover {
    color: #fff;
    background-color: #65463b;
    border-color: #65463b;
}
.btn-lbrown {
    color: #785447;
    background-color: transparent;
    border-color: #785447;
}
.btn-lbrown:hover {
    color: #fff;
    background-color: #785447;
    border-color: #785447;
}


.btn-gray {
    color: #f8f8f8;
    background-color: #9D9D9D;
    border-color: #888888;
}
.btn-gray:hover {
    color: #ffffff;
    background-color: #888888;
    border-color: #888888;
}
.btn-lgray {
    color: #9D9D9D;
    background-color: transparent;
    border-color: #9D9D9D;
}
.btn-lgray:hover {
    color: #fff;
    background-color: #9D9D9D;
    border-color: #9D9D9D;
}


.btn-blue-gray {
    color: #f8f8f8;
    background-color: #5F7C8A;
    border-color: #516a76;
}
.btn-blue-gray:hover {
    color: #fff;
    background-color: #516a76;
    border-color: #516a76;
}
.btn-lblue-gray {
    color: #5F7C8A;
    background-color: transparent;
    border-color: #5F7C8A;
}
.btn-lblue-gray:hover {
    color: #fff;
    background-color: #5F7C8A;
    border-color: #5F7C8A;
}


.btn-black {
    color: #f8f8f8;
    background-color: #2d2d2d;
    border-color: #000000;
}
.btn-black:hover {
    color: #fff;
    background-color: #000000;
    border-color: #000000;
}
.btn-lblack {
    color: #2d2d2d;
    background-color: transparent;
    border-color: #2d2d2d;
}
.btn-lblack:hover {
    color: #fff;
    background-color: #2d2d2d;
    border-color: #2d2d2d;
}


.btn-white {
    color: #000000;
    background-color: #ffffff;
    border-color: #d3d3d3;
}
.btn-white:hover {
    color: #222222;
    background-color: #f7f7f7;
    border-color: #d3d3d3;
}




.text-red {
    color: #F34235;
}

.text-pink {
    color: #E81D62;
}

.text-purple {
    color: #9B26AF;
}

.text-deep-purple {
    color: #6639B6;
}

.text-indigo {
    color: #3E50B4;
}

.text-blue {
    color: #2095F2;
}

.text-light-blue {
    color: #02A8F3;
}

.text-cyan {
    color: #00BBD3;
}

.text-teal {
    color: #009587;
}

.text-green {
    color: #4BAE4F;
}

.text-light-green {
    color: #8AC249;
}

.text-lime {
    color: #CCDB38;
}

.text-yellow {
    color: #FEEA3A;
}

.text-amber {
    color: #FEC006;
}

.text-orange {
    color: #FFD966;
}

.text-deep-orange {
    color: #FE5621;
}

.text-brown {
    color: #785447;
}

.text-gray {
    color: #9D9D9D;
}

.text-blue-gray {
    color: #5F7C8A;
}

.text-black {
    color: #2d2d2d;
}

.africazoom { display: none; }


  .suggestionsBox {  
    background-color: #F7D358;
    border: 2px solid #f2f2f2;
    color: #000000;
    margin: -10px 0 0;
    position: relative;
    width: 300px;
    }  
      
    .suggestionList {  
        margin: 0px;  
        padding: 0px;  
    }  
      
    .suggestionList li {  
        list-style: outside none none;
        margin: 0px 0px 3px 0px;  
        padding: 3px;  
        cursor: pointer;  
    }  
      
    .suggestionList li:hover {  
        background-color: #c2c2c2;  
    }  
	


#slider {
  position: relative;
  overflow: hidden;
  margin: 20px auto 0 auto;
  border-radius: 4px;
}

#slider ul {
  position: relative;
  margin: 0;
  padding: 0;
  height: 200px;
  list-style: none;
}

#slider ul li {
  position: relative;
  display: block;
  float: left;
  margin: 0;
  padding: 0;
  width: 200px;
  height: 200px;
  background: #fff;
  text-align: center;
  line-height: 200px;
}

a.control_prev, a.control_next {
  position: absolute;
  top: 40%;
  z-index: 999;
  display: block;
  padding: 4% 3%;
  width: auto;
  height: auto;
  background: #2a2a2a;
  color: #fff;
  text-decoration: none;
  font-weight: 300;
  font-size: 12px;
  opacity: 0.8;
  cursor: pointer;
}

a.control_prev:hover, a.control_next:hover {
  opacity: 1;
  -webkit-transition: all 0.2s ease;
}

a.control_prev {
  border-radius: 0 2px 2px 0;
}

a.control_next {
  right: 0;
  border-radius: 2px 0 0 2px;
}

.slider_option {
  position: relative;
  margin: 10px auto;
  width: 160px;
  font-size: 18px;
}
/* ///////////////////////////////////*/
/* multisteps*/
/* ///////////////////////////////////*/
#signup-step{margin:auto;padding:0;width:95%}
#signup-step li{list-style:none; float:left;padding:5px 10px;border-top:#004C9C 1px solid;border-left:#004C9C 1px solid;border-right:#004C9C 1px solid;border-radius:5px 5px 0 0;}
.activevisible{color:#FFF;}
#signup-step li.activevisible{background-color:#0B610B;}
/* pere*/
#peresignup-step{margin:auto;padding:0;width:84%}
#peresignup-step li{list-style:none; float:left;padding:5px 10px;border-top:#004C9C 1px solid;border-left:#004C9C 1px solid;border-right:#004C9C 1px solid;border-radius:5px 5px 0 0;}
.activevisiblepere{color:#FFF;}
#peresignup-step li.activevisiblepere{background-color:#0B610B;}

/* mere*/
#meresignup-step{margin:auto;padding:0;width:84%}
#meresignup-step li{list-style:none; float:left;padding:5px 10px;border-top:#004C9C 1px solid;border-left:#004C9C 1px solid;border-right:#004C9C 1px solid;border-radius:5px 5px 0 0;}
.activevisiblemere{color:#FFF;}
#meresignup-step li.activevisiblemere{background-color:#0B610B;}

/* relation*/
#relationsignup-step{margin:auto;padding:0;width:84%}
#relationsignup-step li{list-style:none; float:left;padding:5px 10px;border-top:#004C9C 1px solid;border-left:#004C9C 1px solid;border-right:#004C9C 1px solid;border-radius:5px 5px 0 0;}
.activevisiblerelation{color:#FFF;}
#relationsignup-step li.activevisiblerelation{background-color:#0B610B;}

/* enfants*/
#enfantssignup-step{margin:auto;padding:0;width:84%}
#enfantssignup-step li{list-style:none; float:left;padding:5px 10px;border-top:#004C9C 1px solid;border-left:#004C9C 1px solid;border-right:#004C9C 1px solid;border-radius:5px 5px 0 0;}
.activevisibleenfants{color:#FFF;}
#enfantssignup-step li.activevisibleenfants{background-color:#0B610B;}

#signup-form{clear:both;border:1px #0B610B solid;padding:20px;width:85%;margin:auto;}


.demoInputBox{padding: 10px;border: #CDCDCD 1px solid;border-radius: 4px;background-color: #FFF;width: 100%;}

.signup-error{color:#FF0000; padding-left:15px;}

.message {color: #396;font-weight: bold; font-size:16px; margin-left:22%; width: 100%;padding: 10;}

.tLink{
	font-family:tahoma;
	size:12px;
	padding-left:10px;
	text-align:center;
}

.activeerror{color:#FF0000;}


/* search color*/

li em {
  color:#DF0101;
  font-weight:bold;
  font-style:normal;
}


 /* The switch - the box around the slider 
 https://www.w3schools.com/howto/howto_css_switch.asp
 */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

/*http://ageekandhisblog.com/css-how-to-easily-hide-content-on-only-mobile-or-only-desktop/*/
//medium+ screen sizes
@media (min-width:992px) {
    .desktop-only {
        display:block !important;
    }
}
 
//small screen sizes
@media (max-width: 991px) {
    .mobile-only {
        display:block !important;
    }
 
    .desktop-only {
        display:none !important;
    }
}

.pagination1 {
margin:0; 
padding:0;
float:left;
}
.pagination1 ul {
width:100%;
float: right;
list-style: none;
margin:0 0 0 ;
padding:0;
}
.pagination1 li span { line-height:20px; font-weight:bold;}
.pagination1 li {
margin:0 0 0 0;
float:left;
font-size:12px;
}
.pagination1 li a {
color:blue;
padding:10px 0 0 0; width:33px; height:33px;
text-decoration:none; text-align:center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
display:block;
}
.pagination1 li:last-child a:hover { background:none; color:#7f8588;}
.pagination1 li:first-child a:hover { background:none;color:#7f8588;}
.pagination1 li a:hover {
background-color: #999999;
text-decoration: none;
display: block;
padding:10px 0 0 0; width:33px; height:33px;
}
.pagination1 li.activepage a { 
color:#F00;
text-decoration: none;
padding: 10px 0 0 0;
background-color: #999999;
 }
 
 
  .cherchersBox {  
    background-color: #f2f2f2;
    border: 2px solid #f2f2f2;
    color: #000000;
    margin: -10px 0 0;
    position: relative;
    width: 300px;
    }  
      
    .chercherList {  
        margin: 0px;  
        padding: 0px;  
    }  
      
    .chercherList li {  
        list-style: outside none none;
        margin: 0px 0px 3px 0px;  
        padding: 3px;  
        cursor: pointer;  
    }  
      
    .chercherList li:hover {  
        background-color: #0B610B;  
    } 
	

.footer {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   background-color: #c3c3c3;
   color: white;
   text-align: center;
}

	#calendar {
		max-width: 800px;
	}
	.col-centered{
		float: none;
		margin: 0 auto;
	}

.link {padding: 10px 15px;background: transparent;border:#bccfd8 1px solid;border-left:0px;cursor:pointer;color:#607d8b}
.disabled {cursor:not-allowed;color: #bccfd8;}
.current {background: #da2625;}
.first{border-left:#bccfd8 1px solid;}
#pagination{margin-top: 20px;padding-top: 30px;border-top: #F0F0F0 1px solid;}
.dot {padding: 10px 15px;background: transparent;border-right: #bccfd8 1px solid;}
#overlay {background-color: rgba(0, 0, 0, 0.6);z-index: 999;position: absolute;left: 0;top: 0;width: 100%;height: 100%;display: none;}
#overlay div {position:absolute;left:50%;top:50%;margin-top:-32px;margin-left:-32px;}

/*  monmodal
//////////////////////////////////////////////////////*/
/* The monModal (background) */
.monModal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* monModal Content */
.monModal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
}

/* The monclose Button */
.monclose {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.monclose:hover,
.monclose:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

/* organozational chart horozontal line in chrome  https://stackoverflow.com/questions/35398705/why-is-chrome-showing-extra-line-when-using-google-org-chart*/
/*table.google-visualization-orgchart-table {
  border-collapse: inherit;
}*/

/* ggogle table: https://gist.github.com/tyoshikawa1106/d2ba2ab1490f93592d0d*/
/* .cssHeaderRow {
                background-color: #2A94D6;
            }
            .cssTableRow {
                background-color: #F0F1F2;
            }
            .cssOddTableRow {
                background-color: #F0F1F2;
            }
            .cssSelectedTableRow {
                font-size: 20px;
                font-weight:bold;
            }
            .cssHoverTableRow {
                background: #ccc;
            }*/
            .cssHeaderCell {
                color: #DF7401;
				 background: #f3f3f3;
                font-size: 14px;
              /*  padding: 10px !important;*/
                border: solid 1px red;
				   border-width: 4px 0 0 0;
				   	 border-bottom: 1px solid #000000;
            }
            .cssTableCell {
                font-size: 14px;
		            text-align: center;
              /*  padding: 10px !important;*/
                border: solid 1px green;
				   border-width: 4px 0 0 0;
				 border-bottom: 1px solid #000000;
				
            }
      /*      .cssRowNumberCell {
                text-align: center;
            }*/
			

/*.google-visualization-table-table td.custom-table-td {
    border: solid green;
    border-width: 2px 2px 1px 1px;
*/}
/*https://stackoverflow.com/questions/25042874/how-can-i-change-the-css-properties-of-a-google-visualization-table-and-it-colum*/
/*.google-visualization-table-table *  { font-size:12pt; } */

/* Popup box BEGIN 
//////////////////////////////////*/
.zoom {
  padding: 50px;
  background-color: green;
  transition: transform .2s; /* Animation */
  width: 200px;
  height: 200px;
  margin: 0 auto;
}

.zoom:hover {
  transform: scale(1.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}
/* Popup box end
////////////////////////////////////// */

/*loader*/
.loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid orange;
  border-bottom: 16px solid green;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}



/* end loader*/

/* e- calendar*/


.calendar  * {
    box-sizing: border-box;
    font-family: Tahoma;
    font-size: 14px;
}
.calendar-sm {
    cursor: default;
    width: 800px;
    height: 370px;
}
.calendar {
    cursor: default;
    width: 600px;
    height: 270px;
}

.calendar-sm .c-pad-top {
    padding-top: 2%;
}
/* e- calendar*/

/* caroussel*/
.carousel{
    background: #2f4357; /*#2f4357*/
    margin-top: 5px;
	 background-color: #ffffff !important;
}
.carousel .item{
    min-height: 80px; /* Prevent carousel from being distorted if for some reason image doesn't load */
	text-align: center;
	 background-color:  #ffffff !important;
}
.carousel .item img{
    margin: 0 auto; /* Align slide image horizontally center */
	
}
.bs-example{
	margin: 5px;
}
/* end carouseel*/

/*fade carrousell  */
.carousel-fade .carousel-inner .item {
  opacity: 0;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}
.carousel-fade .carousel-inner .active {
  opacity: 1;
}
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}
.carousel-fade .carousel-control {
  z-index: 2;
}

/* CSS TICKER - ALLWEBCO DESIGN CORPORATION  https://code-boxx.com/html-css-news-ticker-horizontal-vertical/*/

 @keyframes ticker {
    0% { transform: translate3d(0, 0, 0); }
    100% { transform: translate3d(-100%, 0, 0); }
  }
  .tcontainer{
    width: 100%;
    overflow: hidden;
  }
  .ticker-wrap {
    width: 100%;
    padding-left: 100%;
    background-color: #eee;
  }
  .ticker-move {
    display: inline-block;
    white-space: nowrap;
    padding-right: 100%;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-name: ticker;
    animation-duration: 150s;
  }
  .ticker-move:hover{
    animation-play-state: paused;
  }
  .ticker-item{
    display: inline-block;
    padding: 0 2rem;
  }
/***************
END 
***************/

/* texte slide*/


/* Slides  https://www.w3schools.com/w3css/tryit.asp?filename=tryw3css_slideshow_auto
https://css-tricks.com/infinite-all-css-scrolling-slideshow
https://codepen.io/craigmd/pen/dvPGgY
/*/
.mySlides {
  display: none;
 /* padding: 2px;*/
  text-align: center;
}

/*text carroussels  https://codepen.io/cassidoo/pen/MyaWzp*/




.content-slider {

  width: 100%;

  height: 80px;

}



.slider {

  height: 75px;

  width: 500px;

  margin: 4px auto 0;

  overflow: visible;

  position: relative;

}



.mask {

  overflow: hidden;

  height: 75px;

}



.slider ul {

  margin: 0;

  padding: 0;

  position: relative;

}



.slider li {

  width: 500px;

  height: 85px;

  position: absolute;

  top: -25px;

  list-style: none;

}



.slider .quote {

  font-size: 14px;

  font-style: italic;

}



.slider .source {

  font-size: 20px;

  text-align: right;

}



.slider li.anim1 {

  -moz-animation: cycle 15s linear infinite;

  -webkit-animation: cycle 15s linear infinite;

  animation: cycle 15s linear infinite;

}



.slider li.anim2 {

  -moz-animation: cycle2 15s linear infinite;

  -webkit-animation: cycle2 15s linear infinite;

  animation: cycle2 15s linear infinite;

}



.slider li.anim3 {

  -moz-animation: cycle3 15s linear infinite;

  -webkit-animation: cycle3 15s linear infinite;

  animation: cycle3 15s linear infinite;

}



.slider li.anim4 {

  -moz-animation: cycle4 15s linear infinite;

  -webkit-animation: cycle4 15s linear infinite;

  animation: cycle4 15s linear infinite;

}



.slider li.anim5 {

  -moz-animation: cycle5 15s linear infinite;

  -webkit-animation: cycle5 15s linear infinite;

  animation: cycle5 15s linear infinite;

}



.slider:hover li {

  -moz-animation-play-state: paused;

  -webkit-animation-play-state: paused;

  animation-play-state: paused;

}



@-moz-keyframes cycle {

  0% {

    top: 0px;

  }

  4% {

    top: 0px;

  }

  16% {

    top: 0px;

    opacity: 1;

    z-index: 0;

  }

  20% {

    top: 25px;

    opacity: 0;

    z-index: 0;

  }

  21% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

  92% {

    top: -25px;

    opacity: 0;

    z-index: 0;

  }

  96% {

    top: -25px;

    opacity: 0;

  }

  100% {

    top: 0px;

    opacity: 1;

  }

}



@-moz-keyframes cycle2 {

  0% {

    top: -25px;

    opacity: 0;

  }

  16% {

    top: -25px;

    opacity: 0;

  }

  20% {

    top: 0px;

    opacity: 1;

  }

  24% {

    top: 0px;

    opacity: 1;

  }

  36% {

    top: 0px;

    opacity: 1;

    z-index: 0;

  }

  40% {

    top: 25px;

    opacity: 0;

    z-index: 0;

  }

  41% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

  100% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

}



@-moz-keyframes cycle3 {

  0% {

    top: -25px;

    opacity: 0;

  }

  36% {

    top: -25px;

    opacity: 0;

  }

  40% {

    top: 0px;

    opacity: 1;

  }

  44% {

    top: 0px;

    opacity: 1;

  }

  56% {

    top: 0px;

    opacity: 1;

  }

  60% {

    top: 25px;

    opacity: 0;

    z-index: 0;

  }

  61% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

  100% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

}



@-moz-keyframes cycle4 {

  0% {

    top: -25px;

    opacity: 0;

  }

  56% {

    top: -25px;

    opacity: 0;

  }

  60% {

    top: 0px;

    opacity: 1;

  }

  64% {

    top: 0px;

    opacity: 1;

  }

  76% {

    top: 0px;

    opacity: 1;

    z-index: 0;

  }

  80% {

    top: 25px;

    opacity: 0;

    z-index: 0;

  }

  81% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

  100% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

}



@-moz-keyframes cycle5 {

  0% {

    top: -25px;

    opacity: 0;

  }

  76% {

    top: -25px;

    opacity: 0;

  }

  80% {

    top: 0px;

    opacity: 1;

  }

  84% {

    top: 0px;

    opacity: 1;

  }

  96% {

    top: 0px;

    opacity: 1;

    z-index: 0;

  }

  100% {

    top: 25px;

    opacity: 0;

    z-index: 0;

  }

}



@-webkit-keyframes cycle {

  0% {

    top: 0px;

  }

  4% {

    top: 0px;

  }

  16% {

    top: 0px;

    opacity: 1;

    z-index: 0;

  }

  20% {

    top: 25px;

    opacity: 0;

    z-index: 0;

  }

  21% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

  50% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

  92% {

    top: -25px;

    opacity: 0;

    z-index: 0;

  }

  96% {

    top: -25px;

    opacity: 0;

  }

  100% {

    top: 0px;

    opacity: 1;

  }

}



@-webkit-keyframes cycle2 {

  0% {

    top: -25px;

    opacity: 0;

  }

  16% {

    top: -25px;

    opacity: 0;

  }

  20% {

    top: 0px;

    opacity: 1;

  }

  24% {

    top: 0px;

    opacity: 1;

  }

  36% {

    top: 0px;

    opacity: 1;

    z-index: 0;

  }

  40% {

    top: 25px;

    opacity: 0;

    z-index: 0;

  }

  41% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

  100% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

}



@-webkit-keyframes cycle3 {

  0% {

    top: -25px;

    opacity: 0;

  }

  36% {

    top: -25px;

    opacity: 0;

  }

  40% {

    top: 0px;

    opacity: 1;

  }

  44% {

    top: 0px;

    opacity: 1;

  }

  56% {

    top: 0px;

    opacity: 1;

    z-index: 0;

  }

  60% {

    top: 25px;

    opacity: 0;

    z-index: 0;

  }

  61% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

  100% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

}



@-webkit-keyframes cycle4 {

  0% {

    top: -25px;

    opacity: 0;

  }

  56% {

    top: -25px;

    opacity: 0;

  }

  60% {

    top: 0px;

    opacity: 1;

  }

  64% {

    top: 0px;

    opacity: 1;

  }

  76% {

    top: 0px;

    opacity: 1;

    z-index: 0;

  }

  80% {

    top: 25px;

    opacity: 0;

    z-index: 0;

  }

  81% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

  100% {

    top: -25px;

    opacity: 0;

    z-index: -1;

  }

}



@-webkit-keyframes cycle5 {

  0% {

    top: -25px;

    opacity: 0;

  }

  76% {

    top: -25px;

    opacity: 0;

  }

  80% {

    top: 0px;

    opacity: 1;

  }

  84% {

    top: 0px;

    opacity: 1;

  }

  96% {

    top: 0px;

    opacity: 1;

    z-index: 0;

  }

  100% {

    top: 25px;

    opacity: 0;

    z-index: 0;

  }

}
/**/
/* Bottom left text https://www.w3schools.com/howto/howto_css_image_text.asp*/
/* Bottom left text https://www.w3schools.com/howto/howto_css_image_text.asp*/
/* Bottom right text */
.bottom-right {
  position: absolute;
  bottom: 8px;
  right: 16px;
  font-size:10px;
}
.containeur {
  position: relative;
  text-align: center;

}