/*
 * Style pour le site Acarologia
 *
 */
 
/* body occupe toute la place pas de marge 
   élimine les différences entre browsers
   ecriture noire.
*/
* {padding: 0;} /* permet de voir des pb de marge ou de padding */

/*<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">*/
/*
body { 
    margin:0px;
    padding:0;
    color:#000000;
    background: #F8F8F8;
    font-size:14px;
    font-family: "Noto Sans", sans-serif;
}
*/
body { 
    font-size:100%;
}
h1 {
    color:#009DEB; /*deepskyblue;*/
    padding-top: 20px;
    padding-bottom: 10px;
    font-size: 150%;  
}
h2 {
    color: #009DEB; /*deepskyblue;*/
    padding-left: 10px;
    padding-top: 15px;
    padding-bottom: 10px;
    font-size: 120%;
}
h3 {
    color: black;
    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 120%;
    font-weight: bold;
}
h4 {
    color: black;
    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 110%;
    font-weight: bold;
}

/* le p pose des problèmes d'alignement */
/*p {
    text-align: justify;
    line-height: 1.5em;
}
li {
    text-align:justify;
}
*/
a:link {
    text-decoration:none;
    color: black;
}

a:visited {
    text-decoration:none;
    color: black;
}

a:hover {
    color: darkorange;
}
a.bleu{
    color: blue;
}
a.bleu:hover{
    color: darkorange;
}

a.blanc{
    color: white;
}
a.blanc:hover{
    color: darkorange;
}
/* le container de la page un contenu qui occupe toute la place disponible */


/* ============ protection des mails  ======================= */

.invisible { display: none; } 
    
/* ========== Le milieu de page ======== */

.corps {
    text-align: justify;
    /*font-size: 90%;*/
    line-height: 1.5em;
}
.section {
    color:#009DEB; /*deepskyblue;*/
    padding-top: 20px;
    padding-bottom: 10px;
    font-size: 140%;
}
.subsection {
    color: #009DEB; /*deepskyblue;*/
    padding-left: 10px;
    padding-top: 15px;
    padding-bottom: 10px;
    font-size: 110%;
}
.subsubsection {
    color: black;
    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 110%;
    font-weight: bold;
}
.subsubsubsection {
    color: black;
    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 100%;
    font-weight: bold;
}
.legende {
    background: red;
    text-align: justify;
    font-size: 90%;
    line-height:110%;
    border: 1px solid #009DEB;
}

aside { 
  position: relative;
  float:right;
  width:300px; 
  top: 10px;
  bottom: 0px;
}

/* ============ les boutons et autres  ======================= */

.crcl_bleu {
display: table-cell;
width: 33px;
height: 33px; 
line-height:33px; 
background: #009DEB;
font-weight: bold 12px; 
border-radius:50%;
color: white;
text-align: center;
}

.bouton15 {
display: table-cell;
width: 33px;
height: 33px; 
line-height:33px; 
background: white;
font-weight: bold 12px; 
border-radius:50%;
color: black;
text-align: center;
}

.bouton16 {
    display: table-cell;
    width: 105px;
    height: 25px; 
    line-height:25px; 
	border:none;
	padding:6px 0 6px 0;
	border-radius:50%;
	border-bottom:7px solid #009DEB;
	font:bold 12px;
	color:#555;
	background:#fff;
	box-shadow:2px 2px 3px #999;
	border-top:2px solid darkorange;
    text-align: center;
}

/* ============ lignes diverses  ======================= */
lignepointille {
	height: none;
	border: none;
	border-top: 1px dashed grey;
}


/* ============ pied de page  ======================= */

.piedpage {
    clear: both;  /* en premier au cas ou on ait un float */
	position: absolute;
    background: linear-gradient(to top, #B0B0B0 0%, #F8F8F8  100%);
    border-top:1px solid black;
    padding-left: 20px;
    padding-right: 20px;
    clear:both; 
	text-align:center;
	font-size:12px;
    margin: auto;
  
}

/* ============ les balises modifiées  ======================= */

figure {
    margin-left: auto;
    margin-right: auto;
    border:1px solid darkgrey; 
    background: #F8F8F8;
    padding : 5px;
    border-radius: 3px;
    /*width: 880px;*/
}

/* ============ espacer les div  ======================= */

.espacer80 {
  padding-top: 80px;
} 
.espacer50 {
  padding-top: 30px;
} 
.espacer30 {
  padding-top: 30px;
} 

/* =================== bootstrap complement ================== */
/* https://work.smarchal.com/twbscolor/3.3.7/css/666666595959d9d9d9ffffff0 */
/* navbar */

.navbar {
  background-color: #666666;
}
.navbar .navbar-brand {
  color: #009DEB;
}
.navbar .navbar-brand:hover,
.navbar .navbar-brand:focus {
  color: #ff8c00;
}
.navbar .navbar-text {
  color: #d9d9d9;
}
.navbar .navbar-text a:hover,
.navbar .navbar-text a:focus {
  color: #ff8c00; 
}
.navbar .navbar-nav > li > a {
  color: #d9d9d9;
}
.navbar .navbar-nav > li > a:hover,
.navbar .navbar-nav > li > a:focus {
  color: #ff8c00;
}
.navbar .navbar-nav > .active > a,
.navbar .navbar-nav > .active > a:hover,
.navbar .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color: #333333;
}
.navbar .navbar-nav > .open > a,
.navbar .navbar-nav > .open > a:hover,
.navbar .navbar-nav > .open > a:focus {
  color: #ff8c00;
  background-color: #333333;
}
.navbar .navbar-toggle {
  border-color: #333333;
}
.navbar .navbar-toggle:hover,
.navbar .navbar-toggle:focus {
  background-color: #333333;
}
.navbar .navbar-toggle .icon-bar {
  background-color: #d9d9d9;
}
.navbar .navbar-collapse,
.navbar .navbar-form {
  border-color: #d9d9d9;
}
.navbar .navbar-link {
  color: #d9d9d9;
}
.navbar .navbar-link:hover {
  color: #ffffff;
}

@media (max-width: 767px) {
  .navbar .navbar-nav .open .dropdown-menu > li > a {
    color: #d9d9d9;
  }
  .navbar .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #ffffff;
  }
  .navbar .navbar-nav .open .dropdown-menu > .active > a,
  .navbar .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #ffffff;
    background-color: #333333;
  }
}



/* buttons */ 
.btn-primary {
    background: #009DEB;
    color: #ffffff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
    background:  #0088cc;
}
.btn-primary:active, .btn-primary.active {
    background: #009DEB;
    box-shadow: none;
}

/* container */
@media (min-width: 1500px) {
    .my-custom-container{
        width:1380px;
    }
}
.bg-4 {
  background-color: #4d4d4d;
  color: #ffffff;
  padding: 20px;
}
.bg-vert {
  background-color: #669900;
  color: #ffffff;
  padding: 20px;
}
.bg-abstract {
  background-color: #d9d9d9;
  padding: 20px;
}
bg-keyword {
  background-color: #d9d9d9;
  padding: 3px;
  border-radius: 2px;
}