html,body{
  font-family: verdana,helvetica,arial,sans-serif;
  background-color: white;
  color: black;
  padding: 0;
  margin:0;
}

.bg{
  background-image: url("/img/chemingauche.png");
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 20px 100%;
  max-width: 906px;
  margin: 0 auto;
}

.cv>ul>li {
  margin-bottom: 10px;
}

.cv ul>li>span{
  font-style: italic;
  padding: 10px;
}

.cv.principal ul>li>span,
.cv ul>li>.prix{
  font-size: smaller;
}

ul>li>div{
  padding-left: 10px;
}

.ribbon{
  background-color: #B4B4FF;
  width: 100%;
}

#main{
  max-width: 800px;
  margin: 0 auto;
  overflow: hidden;
  padding-bottom:5px;
  padding-left:20px;
  padding-right:20px;
}

#main>div {
  text-align:justify;
}

#main>.center {
  text-align:center;
}

.center>h3 {
  display:inline-block;
  max-width: 309px;
  vertical-align: top;
}

.methode>div {
  border-bottom: thin solid black;
  border-right: thin solid black;
  padding: 10px;
  border-bottom-right-radius: 50px;
}

.methode>h3 {
  background-color:lightblue;
}

.methode>div>h4 {
  text-decoration: underline;
}

.methode>div>ul>li>span{
  font-weight: bold; 
}

h1 {
  text-align: center;
  font-weight: normal;
  background-color: rgb(255,0,150);
  margin: 0;
  padding-top: 20px;
  padding-bottom: 10px;
  background-image: url("/img/fields.png");
  background-position: center top;
}

h1 span{
  display: block;
}

h1>span{
  background-color:rgb(255,0,150);
  margin: 0 auto;
  max-width:700px;
  height:100%;
  border: solid medium black;
}

h1 .who, h1 .what{
  font-size: 44px;
}

h1 .how{
  margin-top: 20px;
  font-size:30px;
}

h1 .howmore{
  margin-top: 10px;
  font-size:22px;
}

h2>img {
  vertical-align: middle;
}

h3 {
  text-align: center;
}

.grad {
  min-height: 20px;
  background: #999; /* for non-css3 browsers */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dd0580', endColorstr='#B4B4FF'); /* for IE */
  background: -webkit-gradient(linear, left top, left bottom, from(#dd0580), to(#B4B4FF)); /* for webkit browsers */
  background: -moz-linear-gradient(top,  #dd0580,  rgb(180,180,255)); /* for firefox 3.6+ */ 
}

.menu{
  max-width:906px;
  margin: 0 auto;
  text-align:center;
  background-image: url("/img/chemintop.png");
  background-position: 8px bottom;
  background-repeat: no-repeat;
  background-size: 15px 76px;

}

.menu>ul{
  margin:0;
  padding:0;
  top:-20px;
  position:relative;
}

.menu>ul>li{
  display:inline-block;
  padding: 0 7px;
  font-size: 1.2em;
  font-weight:bold;
}

.menu>ul>li>a{
  color: darkred;
  text-decoration:none;
  vertical-align: middle;
}

/* for IE9 */
.menu>ul>li>a>img{
  border: none;
}

.menu>ul>li>a:hover{
  color: yellow;
}

.menu>ul>li>.current{
  text-decoration:underline;
  color: black;
}

.footer{
  padding: 0 0;
  font-size:0.8em;
  text-align:center;
  top:-1px;
  position:relative;
  margin-left:20px;
  margin-right: 20px;
}

.footer .path{
  height: 68px;
  max-width:866px;
  margin: 0 auto;
  background-image: url("/img/cheminbas.png");
  background-repeat: no-repeat;
}

.footer .version{
  color: #DDDDDD;
  font-size:smaller;
}

.footer a{
  color: black;
  text-decoration:none;
}

.footer>.lightlink>a{
  color: black;
  text-decoration:none;
}

.item{
  font-weight: bold;
  display:inline-block;
  height:100%;
}

.item+span{
  display:inline-block;
  height:100%;
}

.emphasized{
  font-weight: bold;
  font-style: italic;
}

.underlined{
  text-decoration: underline;
}

.copyright {
  font-size: 11px;
  font-family: Helvetica, arial, sans-serif;
  text-align: right;
}

.copypright span{
  border-left: solid thin black;
  border-right: solid thin black;
  border-top: solid thin black;
}

.infoUtile {
  background-color: lightblue;
  margin: 20px 0;
  width:100%;
  display:flex;
  align-items: stretch;
}

.infoUtile>div {
  flex:1;
  text-align: center;
}

.infoUtile>.horaires {
  border-right: solid medium black;
}

.infoUtile>.rdv {
  border-left: solid medium black;
}

.message {
  background-color: orange;
  margin-top: 50px; 
  padding: 10px;
}

.message>.title {
  background-color: white;
  color:black; 
  font-weight: bold;
  text-align:center;
}

.message>.date {
  text-align: center;
}

.plan {
  margin: 0 auto;
  text-align: center;
  max-width:600px;
}

.plan>div{
  overflow: auto;
}

.presentation>img{
  vertical-align:middle;
  padding-top:20px
}

.presentation>div{
  display: inline-block;
  vertical-align:middle;
}

.photocab{
  margin: 20px 0;
}

.photocab>div{
  overflow:auto;
  border-top: thin solid black;
  padding-top:30px;
  padding-bottom:20px;
}
.photocab img{
  width:100%;
  height:100%;
}

.formintro{
  text-align:justify;
}

.formcore{
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.formcore>div{
  margin-top:15px;
}

.formcore label{
  display: block;
  text-align: left;
  margin-bottom:5px;
}

.formcore .warning{
  outline: thin solid red;
}

.formcore input,
.formcore textarea {
  width: 100%;
}

form>label, form>input{
  visibility: hidden;
}

iframe {
  width: 100%;
}