body  {
  background-color: #effdfd;
    background-image: url("jour-background.jpg");
    background-size: cover;
    background-position: center top;   

  color: black;
  font-family: "noto serif", Georgia, Garamond, serif;
  font-size: 18px;
}
pre { font-size:16px; }
      
.btn {
    background-color: #c0cbd1;
    border: none;
    color: white;
  	width: 180px;
   	font-size: 18px;
  	font-weight: 600;
  	text-align: right;
    padding: 12px;
}
      
 
a.btn:link, a.btn:visited {
    color: black;
}
a.btn:hover, a.btn:active{
  background-color: #002040;
  color: darkblue;
    cursor: pointer;

} 

      
.btx {
    background-color: #002040;
    border: none;
    color: lightgray;
  	width: 160px;
   	font-size: 18px;
  	font-weight: 600;
  	text-align: right;
    padding: 12px;
}
      
.sousTitre  { color:#c01000;}
      
      
     
.leger     {  color: #844444;}
.moinsleger{ color: #311100; }
.rouge     {color: darkred;font-weight: 700;}
.marine      {color:#05607b;}
.orange    {color: #ffab00;font-weight: 700;}
.txtHigh   { color:#473100;font-weight:700;}


.mobSiz {
  max-width: 100%;
  min-width: 200px;
  height: auto;
}
      
a.buy:link, a.buy:visited {
    background-color: green;
    color: white;
    border: 2px solid MediumSeaGreen ;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
}

a.buy:hover, a.buy:active {
    background-color: MediumSeaGreen;
    color: white;
}
a.buy_s:link, a.buy_s:visited {
    color: lightgreen;
    text-decoration: none;
}

a.buy_s:hover, a.buy_s:active {
    color: white;
}
     
a.dud:link, a.dud:visited {
    background-color: #21618C;
    color: white;
    border: 2px solid MediumSeaGreen ;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
}

a.dud:hover, a.dud:active {
    background-color: #85C1E9;
    color: white;
}


li, dt {
 list-style-type: none;
 background-image: url(puce_c.png);
 background-repeat: no-repeat;

 /*background-position: 0 0.0em;*/
 padding-left: 30px;
 /*padding-bottom: 10px;*/
} 
/*dd { color:darkblue; }*/


/*li::after {content: "\A\A";}*/

code { color:black; }

      
a:link {
	color: #3a3aee;
  text-decoration: none;
}
a:visited {
  color: #030Eaa; /*dark bleu vert*/
  text-decoration: none;
}      
a:hover, a:active {
    color:darkred;
}      
.dropbtn {
    background-color: transparent;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    right: 0;
    background-color: Transparent; 
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1;}
.dropdown:hover .dropdown-content {display: block;}
.dropdown:hover .dropbtn {
    background-color: #c0cbd1;
/*  background-color: #003060;*/
}
      
      
.MsoNormal { color: black; }
.MsoCadre {font-family: "Source Sans Pro", sans; color: darkblue;}

.encadre {
	float:right;
  padding:12px;
  color:black;
  margin:10px;	/*top right bottom left*/
  background-color: #a0ccff;
    background-image: url("jour-background-inverse.jpg");
    background-size: cover;
    background-position: center top;   
  vertical-align:top;
  font-family: "Source Sans Pro", sans;
  font-size: 18px;
}
.zonel {
	float:left;
  padding:12px;
  color:lightskyblue;
  margin:10px;	/*top right bottom left*/
  background-color: #101040;
  vertical-align:top;
  font-family: "Source Sans Pro", sans;

}
 
.padr { /*mnu icon*/
  float:right;
  padding:2px;
  color:lightskyblue;
  margin:2px;
  vertical-align:top;
  font-family: "Source Sans Pro", sans;
}
.lettrine { /*mnu icon*/
  float:left;
  padding:1px;
  color:lightskyblue;
  margin:1px;
  vertical-align:top;
  font-family: "Garamond", serif;
  font-size:72px;
}


textarea, input {
  background-color:lightblue;
  opacity:0.8;
}

.litt{margin-left: 20px;font-size: 28px;opacity:0.8; font-family: Times New Roman;}
.littS{margin-left: 20px;font-size: 18px;opacity:0.9; font-family: Times New Roman;}
.littSblue{margin-left: 20px;font-size: 16px;opacity:0.9; font-family: Times New Roman;color: lightskyblue;}

















/* Style the header */
.header {
    background-color: #f1f1f1;
    padding: 20px;
    text-align: center;
}

/* Style the top navigation bar */
.topnav {
    overflow: hidden;
    background-color: #333;
}

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

/* Change color on hover */
.topnav a:hover {
    color: black;
}

.shine {color:black;}
.p16px {padding:16px;}



/* Clear floats after the col3s */
.row:after {
    content: "";
    display: table;
    clear: both;
}

.mag {  
  text-decoration: none; 
  vertical-align:top;}

.mag:before, .mag:after {
    content: url('puce.png');

}

.tdn {  
  text-decoration: none; 
}

a.tdn:hover, a.tdn:active, a.mag:hover, a.mag:active {
    color:#cb4335;
}

.thd, a.thd {  
  text-decoration: none; 
  color:black;
  text-align: center;

}
.th1 {   text-align: center; }
.th2 {  text-align: center; } /*sous titre*/
.tt {text-align: center; font-size:18px;}

/* Left and right col3 */
.col2.side {
    width: 50%;
    /*border: 1px solid red;*/
    display: table-cell;
    vertical-align: top;
    padding:2;
}
.col1.side {
    width: 100%;
    /*border: 1px solid red;
    display: table-cell;*/
    vertical-align: top;
    padding:2;
}


/* Responsive layout - makes the three col3s stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
    .col2.side {
      display: table;
        width: 100%;
    }
}

@media screen and (max-width: 500px) {
    .thd, a.thd {font-size: 24px; line-height: 0.3;}

}


/* max width*/ 
div.maxwid {
    max-width:800px;
    margin: auto;
    /*border: 3px solid #00AD21;*/
}


.ct {text-align:center; }
.pd { padding:16px; }


.popmenu1 {  
  float:left;
}  
.popmenu2 {  
    position:fixed;  
    top: 0;  
    left:78%;
    z-index: 1;
}