#site_body {
 background-color: #222222;
 color: #FFFFFF;
 font-family: "Open Sans", "sans-serif";
 margin: 5px;
}

img {
 border: 0px;
}

a {
 color: #CCCCCC;
 text-decoration: none;
}

a:hover {
 color: #FFFFFF;
}

#page {
 margin-top: 2px;
}

#header {
 font-size: 250%;
 text-align: center;
 font-weight: bold;
}

#footer {
 padding-top: 10px;
 text-align: center;
}

.annexe {
 display: none;
 font-size: 90%;
}

.item {
 margin-top: 10px;
}

.box {
 border: 1px solid #FFFF00;
 padding: 10px; 
 box-sizing: border-box;
}

.menu a {
 display: block;
 border: 1px solid #000;
 padding: 10px;
 font-weight: bold;
 background-color: #FFBF31;
 color: #000;
}

.menu a:hover {
 background-color: #FFF000;
}

.commande {
 font-size: 90%;
} 

.commande .line {
 margin-top: 10px;
}

.commande .auteur {
 margin-top: 20px;
 color: #FFFF00;
}

.commande .titre {
} 

.commande .nb_pages {
 display: none;
}

.commande .optionscommande {
 float: left;
 width: 60%;
}

.commande .optionsebook {
 text-align: right;
 float: left;
 width: 40%;
}
 
.commande .optionscommande input {
 width: 40px!important;
}

.commande .optionsebook img {
 padding-left: 3px;
 padding-right: 3px;
}

.message_form_ok {

}

.message_form_ko{
 padding: 20px;
 background-color: red;
 color: white;
 font-size: 120%;
}

@media screen and (min-width: 720px) {
 .annexe {
  display: block;
 }


 .main {
  min-height: 500px; 
 }

 .commande .titre {
  float: left;
  width: 50%;
 } 

 .commande .nb_pages {
  float: left;
  width: 10%;
 }

 .commande .optionscommande {
  float: left;
  width: 30%;
 }

 .commande .optionsebook {
  float: left;
  width: 10%;
 }

 .commande input {
 width: 50%!important;
}

 .inscription_newsletter input {
 
  width: 30%!important;
}
 
}