/* ---------- responsive 320 --------- */
@media only screen and (min-width: 320px){
  section#fond_titre {padding: 30px 0;background-size: auto 250%;}
  section#fond_titre h1{width: 240px;margin: 0 calc(50% - 120px);font-size : 16px;line-height: 19px;}
  section#fond_titre h2{width: 290px;margin: 0 calc(50% - 145px);font-size : 16px;line-height: 19px;}
  section#doc_section1 {padding: 40px 0;}
  #doc_section1 h3 {font-size : 16px;line-height: 19px;margin : 0 auto 30px;}
  #doc_section1 ul#docgenerales {width: calc(100% - 105px);margin: 0 52px;}
  #doc_section1 ul#docgenerales  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
  #doc_section1 h4{font-size : 13px;line-height: 16px;margin : 0 auto 5px;}
  #doc_section1 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
  #doc_section1 ul#docgenerales li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
  #doc_section1 ul#docgenerales li a {font-size: 12px;line-height: 13px;margin : 20px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
  #doc_section1 ul#docgenerales li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
  section#doc_section2 {padding: 40px 0;background-size: cover;}
  #doc_section2 h3 {font-size : 16px;line-height: 19px;margin : 0 auto 30px;}
  #doc_section2 ul#connaissance {width: calc(100% - 105px);margin: 0 52px;}
  #doc_section2 ul#connaissance  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
  #doc_section2 h4 {font-size : 13px;line-height: 16px;margin : 0 auto 5px;}
  #doc_section2 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
  #doc_section2 ul#connaissance li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
  #doc_section2 ul#connaissance li a {font-size: 12px;line-height: 13px;margin : 20px auto 5px;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
  #doc_section2 ul#connaissance li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
  section#doc_section3 {padding: 40px 0;}
  #doc_section3 h3 {font-size : 16px;line-height: 19px;margin : 0 auto 30px;}
  #doc_section3 ul#ressources {width: calc(100% - 105px);margin: 0 52px;}
  #doc_section3 ul#ressources  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
  #doc_section3 h4 {font-size : 13px;line-height: 16px;margin : 0 auto 5px;}
  #doc_section3 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
  #doc_section3 ul#ressources li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
  #doc_section3 ul#ressources li a {font-size: 12px;line-height: 13px;margin : 20px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
  #doc_section3 ul#ressources li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
}

/* ---------- responsive 480 --------- */
@media only screen and (min-width: 480px){
  section#fond_titre {padding: 30px 0;background-size: auto 250%;}
  section#fond_titre h1{width: 270px;margin: 0 calc(50% - 135px);font-size : 18px;line-height: 21px;}
  section#fond_titre h2{width: 390px;margin: 0 calc(50% - 195px);font-size : 18px;line-height: 21px;}
  section#doc_section1 {padding: 60px 0;}
  #doc_section1 h3 {font-size : 18px;line-height: 21px;margin : 0 auto 30px;}
  #doc_section1 ul#docgenerales {margin: 0 calc(50% - 200px);width: 400px;}
  #doc_section1 ul#docgenerales  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
  #doc_section1 h4{font-size : 13px;line-height: 16px;margin : 0 auto 5px;}
  #doc_section1 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
  #doc_section1 ul#docgenerales li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
  #doc_section1 ul#docgenerales li a {font-size: 12px;line-height: 13px;margin : 20px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
  #doc_section1 ul#docgenerales li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
  section#doc_section2 {padding: 60px 0;background-size: cover;}
  #doc_section2 h3 {font-size : 18px;line-height: 21px;margin : 0 auto 30px;}
  #doc_section2 ul#connaissance {margin: 0 calc(50% - 200px);width: 400px;}
  #doc_section2 ul#connaissance  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
  #doc_section2 h4 {font-size : 13px;line-height: 16px;margin : 0 auto 5px;}
  #doc_section2 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
  #doc_section2 ul#connaissance li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
  #doc_section2 ul#connaissance li a {font-size: 12px;line-height: 13px;margin : 20px auto 7px;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
  #doc_section2 ul#connaissance li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
  section#doc_section3 {padding: 60px 0;}
  #doc_section3 h3 {font-size : 18px;line-height: 21px;margin : 0 auto 30px;}
  #doc_section3 ul#ressources {margin: 0 calc(50% - 200px);width: 400px;}
  #doc_section3 ul#ressources  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
  #doc_section3 h4 {font-size : 13px;line-height: 16px;margin : 0 auto 5px;}
  #doc_section3 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
  #doc_section3 ul#ressources li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
  #doc_section3 ul#ressources li a {font-size: 12px;line-height: 13px;margin : 20px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
  #doc_section3 ul#ressources li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
}


  /* ---------- responsive 768 --------- */
  @media only screen and (min-width: 768px){
    section#fond_titre {padding: 40px 0;background-size: auto 250%;}
    section#fond_titre h1{width: 320px;margin: 0 calc(50% - 160px);font-size : 21px;line-height: 24px;}
    section#fond_titre h2{width: 380px;margin: 0 calc(50% - 190px);font-size : 21px;line-height: 24px;}
    section#doc_section1 {padding: 60px 0;}
    #doc_section1 h3 {font-size : 21px;line-height: 24px;margin : 0 auto 30px;}
    #doc_section1 ul#docgenerales {margin: 0 calc(50% - 300px);width: 600px;}
    #doc_section1 ul#docgenerales  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
    #doc_section1 h4 {font-size : 14px;line-height: 18px;margin : 0 auto 5px;}
    #doc_section1 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
    #doc_section1 ul#docgenerales li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section1 ul#docgenerales li a {font-size: 12px;line-height: 13px;margin : 20px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section1 ul#docgenerales li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
    section#doc_section2 {padding: 60px 0;background-size: cover;}
    #doc_section2 h3 {font-size : 21px;line-height: 24px;margin : 0 auto 30px;}
    #doc_section2 ul#connaissance {margin: 0 calc(50% - 300px);width: 600px;}
    #doc_section2 ul#connaissance  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
    #doc_section2 h4 {font-size : 14px;line-height: 18px;margin : 0 auto 5px;}
    #doc_section2 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
    #doc_section2 ul#connaissance li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section2 ul#connaissance li a {font-size: 12px;line-height: 13px;margin : 20px auto 7px;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section2 ul#connaissance li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
    section#doc_section3 {padding: 60px 0;}
    #doc_section3 h3 {font-size : 21px;line-height: 24px;margin : 0 auto 30px;}
    #doc_section3 ul#ressources {margin: 0 calc(50% - 300px);width: 600px;}
    #doc_section3 ul#ressources  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
    #doc_section3 h4 {font-size : 14px;line-height: 18px;margin : 0 auto 5px;}
    #doc_section3 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
    #doc_section3 ul#ressources li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section3 ul#ressources li a {font-size: 12px;line-height: 13px;margin : 20px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section3 ul#ressources li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
  }




  /* ---------- responsive 992 --------- */
  @media only screen and (min-width: 992px){
    section#fond_titre {padding: 50px 0;background-size: auto 250%;}
    section#fond_titre h1{width: 360px;margin: 0 calc(50% - 180px);font-size : 24px;line-height: 28px;}
    section#fond_titre h2{width: 440px;margin: 0 calc(50% - 220px);font-size: 24px;line-height: 28px;}
    section#doc_section1 {padding: 60px 0;}
    #doc_section1 h3 {font-size : 24px;line-height: 28px;margin : 0 auto 30px;}
    #doc_section1 ul#docgenerales {margin: 0 calc(50% - 400px);width: 800px;}
    #doc_section1 ul#docgenerales  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
    #doc_section1 h4 {font-size : 14px;line-height: 18px;margin : 0 auto 5px;}
    #doc_section1 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
    #doc_section1 ul#docgenerales li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section1 ul#docgenerales li a {font-size: 12px;line-height: 13px;margin : 20px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section1 ul#docgenerales li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
    section#doc_section2 {padding: 60px 0;background-size: cover;}
    #doc_section2 h3 {font-size : 24px;line-height: 28px;margin : 0 auto 30px;}
    #doc_section2 ul#connaissance {margin: 0 calc(50% - 400px);width: 800px;}
    #doc_section2 ul#connaissance  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
    #doc_section2 h4 {font-size : 14px;line-height: 18px;margin : 0 auto 5px;}
    #doc_section2 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
    #doc_section2 ul#connaissance li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section2 ul#connaissance li a {font-size: 12px;line-height: 13px;margin : 20px auto 10px;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section2 ul#connaissance li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
    section#doc_section3 {padding: 60px 0;}
    #doc_section3 h3 {font-size : 24px;line-height: 28px;margin : 0 auto 30px;}
    #doc_section3 ul#ressources {margin: 0 calc(50% - 400px);width: 800px;}
    #doc_section3 ul#ressources  li {width: 160px;margin : 0 20px 60px 20px;height:310px;}
    #doc_section3 h4 {font-size : 14px;line-height: 18px;margin : 0 auto 5px;}
    #doc_section3 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
    #doc_section3 ul#ressources li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section3 ul#ressources li a {font-size: 12px;line-height: 13px;margin : 20px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section3 ul#ressources li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
  }


  /* ---------- responsive 1200 --------- */
  @media only screen and (min-width: 1200px) {
    section#fond_titre {padding: 70px 0;background-size: auto 250%;}
    section#fond_titre h1{width: 1200px;margin: 0 calc(50% - 600px);font-size : 28px;line-height: 32px;}
    section#fond_titre h2{width: 1200px;margin: 0 calc(50% - 600px);font-size : 28px;line-height: 32px;}
    section#doc_section1 {padding: 70px 0;}
    #doc_section1 h3 {font-size : 28px;line-height: 32px;margin : 0 auto 40px;}
    #doc_section1 ul#docgenerales {margin: 0 calc(50% - 490px);width: 980px;}
    #doc_section1 ul#docgenerales li:nth-child(1) {margin : 0 20px 60px 0;}
    #doc_section1 ul#docgenerales li {width: 160px;margin : 0 20px 60px 20px;}
    #doc_section1 h4 {font-size : 15px;line-height: 19px;margin : 0 auto 5px;}
    #doc_section1 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
    #doc_section1 ul#docgenerales li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section1 ul#docgenerales li a {font-size: 13px;line-height: 13px;margin : 30px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section1 ul#docgenerales li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
    section#doc_section2 {padding: 70px 0;background-size: cover;}
    #doc_section2 h3 {font-size : 28px;line-height: 32px;margin : 0 auto 40px;}
    #doc_section2 ul#connaissance {margin: 0 calc(50% - 490px);width: 980px;}
    #doc_section2 ul#connaissance li:nth-child(1) {margin : 0 20px 0 0;}
    #doc_section2 ul#connaissance  li {width: 160px;margin : 0 20px 60px 20px;}
    #doc_section2 h4 {font-size : 15px;line-height: 19px;margin : 0 auto 5px;}
    #doc_section2 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
    #doc_section2 ul#connaissance li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section2 ul#connaissance li a {font-size: 13px;line-height: 13px;margin : 30px auto 10px;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section2 ul#connaissance li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
    section#doc_section3 {padding: 70px 0;}
    #doc_section3 h3 {font-size : 28px;line-height: 32px;margin : 0 auto 40px;}
    #doc_section3 ul#ressources {margin: 0 calc(50% - 490px);width: 980px;}
    #doc_section3 ul#ressources li:nth-child(1) {margin : 0 20px 0 0;}
    #doc_section3 ul#ressources li {width: 160px;margin : 0 20px 60px 20px;}
    #doc_section3 h4 {font-size : 15px;line-height: 19px;margin : 0 auto 5px;}
    #doc_section3 p {font-size: 12px;line-height: 16px;margin: 10px auto 0;}
    #doc_section3 ul#ressources li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section3 ul#ressources li a {font-size: 13px;line-height: 13px;margin : 30px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section3 ul#ressources li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
}


  /* ---------- responsive 1400 --------- */
  @media only screen and (min-width: 1400px){
    section#fond_titre {padding: 80px 0;background-size: auto 250%;}
    section#fond_titre h1{width: 1200px;margin: 0 calc(50% - 600px);font-size : 30px;line-height: 36px;}
    section#fond_titre h2{ width: 1200px;margin: 0 calc(50% - 600px); font-size : 30px;line-height: 36px;}
    section#doc_section1 {padding: 80px 0;}
    #doc_section1 h3 {font-size : 30px; line-height: 36px;margin : 0 auto 40px;}
    #doc_section1 ul#docgenerales {margin: 0 calc(50% - 490px);width: 980px;text-align: center;}
    #doc_section1 ul#docgenerales li:nth-child(1) {margin: 0 20px 60px 0;}
    #doc_section1 ul#docgenerales li {width: 160px;margin : 0 20px 60px 20px;}
    #doc_section1 h4 {font-size : 16px;line-height: 20px;margin : 0 auto 5px;}
    #doc_section1 p {font-size: 13px;line-height: 18px;margin: 10px auto 0;}
    #doc_section1 ul#docgenerales li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section1 ul#docgenerales li a {font-size: 14px;line-height: 14px;margin : 30px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section1 ul#docgenerales li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
    section#doc_section2 {padding: 80px 0;background-size: cover;}
    #doc_section2 h3 {font-size : 30px; line-height: 36px;margin : 0 auto 40px;}
    #doc_section2 ul#connaissance {margin: 0 calc(50% - 490px);width: 980px;}
    #doc_section2 ul#connaissance li:nth-child(1) {margin : 0 20px 0 0;}
    #doc_section2 ul#connaissance li {width: 160px;margin : 0 20px 60px 20px;}
    #doc_section2 h4 {font-size : 16px;line-height: 20px;margin : 0 auto 5px;}
    #doc_section2 p {font-size: 13px;line-height: 18px;margin: 10px auto 0;}
    #doc_section2 ul#connaissance li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section2 ul#connaissance li a {font-size: 14px;line-height: 14px;margin : 30px auto 10px;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section2 ul#connaissance li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}
    section#doc_section3 {padding: 80px 0;}
    #doc_section3 h3 {font-size : 30px; line-height: 36px;margin : 0 auto 40px;}
    #doc_section3 ul#ressources {margin: 0 calc(50% - 490px);width: 980px;}
    #doc_section3 ul#ressources li:nth-child(1) {margin : 0 20px 0 0;}
    #doc_section3 ul#ressources li {width: 160px;margin : 0 20px 60px 20px;}
    #doc_section3 h4 {font-size : 16px;line-height: 20px;margin : 0 auto 5px;}
    #doc_section3 p {font-size: 13px;line-height: 18px;margin: 10px auto 0;}
    #doc_section3 ul#ressources li .img {width : 160px;margin : 0 calc(50% - 80px) 10px;height: 100px;}
    #doc_section3 ul#ressources li a {font-size: 14px;line-height: 14px;margin : 30px auto 0;padding: 10px 15px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;-o-border-radius: 5px;}
    #doc_section3 ul#ressources li a.btn2 {width: 110px;margin: 30px calc(50% - 55px) 10px;}

  }