/* Css For Carneshop */

/************ TABLE OF CONTENTS ***************
1. Fonts
2. Reset
3. Global
4. Main Header/style-one/style-two
5. Main Slider/style-one/style-two
6. Intro Section
7. Welcome Section
9. Cta Section
8. Research Fields
10. Testimonial Section
11. Researches Section
12. Team Section
14. Video
15. Fact Counter
16. News Section
19. Clients Section
20. Main Footer
21. Footer Bottom
22. Research Style Two
23. Innovative Solution
24. Discover Section
25. Testimonial Section
26. Chooseus Section
27. News Style Two
28. Page Title
29. Research Page Section
30. Research Details
31. Professor Page Section
32. Professor Details
33. About Section
34. Error Section
35. Blog Page Section
36. Blog Details
37. Blog Sidebar
38. Contact Section
39. Google Map


**********************************************/



/*** 

====================================================================
  Reset
====================================================================

 ***/
* {
  margin:0px;
  padding:0px;
  border:none;
  outline:none;
}


/*** 

====================================================================
  Global Settings
====================================================================

 ***/


body {
  font-size:16px;
  color:#333;
  line-height:30px;
  background:#ffffff;
  font-family: "Quicksand", sans-serif;
  font-optical-sizing: auto;
}

.large-container{
  max-width: 1420px;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

/***

====================================================================
  Banner
====================================================================

 ***/

#banner{
  padding-top: 50px;
  padding-bottom: 50px;
}

  #banner .header-logo{
    display: flex;
    justify-content: center;
    align-items: center;
  }

    #banner .header-logo .logo{
      max-width: 100%;
      height: 150px;
    }

@media (max-width: 480px) {

  #banner .header-logo .logo{
    height: 100px;
  }

}

/***

====================================================================
Raccourcis
====================================================================

***/

#cta{
  background-color: #f3dd9b;
  padding-top: 100px;
  padding-bottom: 50px;
}

  #cta .bloc-cta{
    display: flex;
    align-items: center;
    justify-content: center;
  }

    #cta .bloc-cta .bloc-cta-picture{
      width: 250px;
      height: 250px;
      background: #FFFFFF 0% 0% no-repeat padding-box;
      box-shadow: 0px 0px 50px #0000000D;
      border-radius: 50px;
      opacity: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 0 auto;
      margin-bottom: 20px;
    }

      #cta .bloc-cta .bloc-cta-picture img.image{
        box-shadow: 0px 0px 50px #0000000D;
        border-radius: 35px;
        width: 210px;
      }

  #cta .bloc-cta img.title{
    width: 370px;
  }

.cta-bottom{
  background: transparent url('../images/cta-background.png') 0% 0% no-repeat;
  background-size: cover;
  height: 500px;
}

@media (min-width: 769px) and (max-width: 1024px) {

  .cta-bottom{
    height: 325px;
  }

}

@media (min-width: 481px) and (max-width: 768px) {

  .cta-bottom{
    height: 200px;
  }

}

@media (max-width: 768px) {

  #cta{
    padding-top: 50px;
    padding-bottom: 25px;
  }

  #cta .bloc-cta .bloc-cta-picture{
    width: 200px;
    height: 200px;
  }

  #cta .bloc-cta .bloc-cta-picture img.image{
    width: 160px;
  }

  #cta .bloc-cta img.title{
    margin-bottom: 30px;
    width: 300px;
  }

}

@media (max-width: 480px) {

  .cta-bottom{
    height: 100px;
  }

}

/***

====================================================================
Qui sommes-nous
====================================================================

***/

#qsn{
  text-align: center;
  padding-top: 50px;
}

  #qsn .qsn-title{
    margin-bottom: 80px;
    margin-top: 40px;
  }

    #qsn .qsn-title img{
      width: 430px;
    }

  #qsn .qsn-sub-title{
  }

    #qsn .qsn-sub-title img{
      width: 250px;
      margin-bottom: 15px;
    }

    #qsn .qsn-sub-title h1{
      font: normal normal bold 35px/60px Poppins;
      letter-spacing: 1.23px;
      color: #004C5E;
    }

  #qsn .dots{
    color: #F5D15C;
    letter-spacing: 2px;
    margin-bottom: 50px;
    margin-top: 25px;
    font: normal normal bold 35px/35px Poppins;
  }

  #qsn .qsn-content {

  }

    #qsn .qsn-content h2{
      font: normal normal bold 22px/37px Quicksand;
      letter-spacing: 0.72px;
      color: #DF786D;
    }

  #qsn .qsn-content p{
    font: normal normal normal 18px/33px Quicksand;
    letter-spacing: 0.63px;
    color: #004C5E;
    margin-top: 30px;
  }

@media (max-width: 480px) {

  #qsn .qsn-title img{
    width: 350px;
  }

  #qsn .qsn-sub-title h1{
    font: normal normal bold 29px/29px Poppins;
    letter-spacing: 1.23px;
    color: #004C5E;
  }

}

/***

====================================================================
Footer
====================================================================

***/

.before-footer{
  background: transparent url('../images/Ludimax_Footer.png') 0% 0% no-repeat;
  background-size: cover;
  height: 500px;
}

footer{
  background-color: #004C5E;
  padding-top: 50px;
  padding-bottom: 50px;
  font: normal normal normal 16px/31px Quicksand;
  letter-spacing: 0.5px;
}

  footer .footer-first-col{

  }

    footer .footer-first-col h3{
      font: normal normal bold 18px/36px Quicksand;
      letter-spacing: 0.55px;
      color: #FFFFFF;
    }
      footer .footer-first-col h3 span.green{
        color: #5FBEB6;
      }
      footer .footer-first-col h3 span.orange{
        color: #F5D15C;
      }
      footer .footer-first-col h3 span.red{
        color: #DF786D;
      }

    footer .footer-first-col p{
      font: normal normal normal 16px/25px Quicksand;
      letter-spacing: 0.5px;
      color: #FFFFFF;
      margin-top: 20px;
      margin-bottom: 50px;
    }

    footer .footer-first-col img{
      width: 200px;
    }

  footer .footer-second-col{

  }

    footer .footer-second-col .horaires{
      background: #FFFFFF 0% 0% no-repeat padding-box;
      border: 3px solid #F5D15C;
      border-radius: 23px;
      padding: 10px 7px;
    }

      footer .footer-second-col .horaires h3{
        font: normal normal bold 18px/36px Quicksand;
        letter-spacing: 0.55px;
        color: #004C5E;
        margin-bottom: 20px;
      }
        footer .footer-second-col .horaires h3 span{
          color: #5FBEB6;
        }

    footer .footer-second-col .horaires ul{
      list-style: none;
      font: normal normal normal 16px/27px Quicksand;
      letter-spacing: 0.5px;
      color: #004C5E;
    }

    footer .footer-second-col .horaires p.remark{
      background: #DF786D 0% 0% no-repeat padding-box;
      border-radius: 12px;
      font: normal normal normal 12px/16px Quicksand;
      letter-spacing: 0.4px;
      color: #FFFFFF;
      padding: 10px;
    }

  footer .footer-third-col{
    padding-left: 50px;
  }

    footer .footer-third-col h3{
      font: normal normal bold 18px/36px Quicksand;
      letter-spacing: 0.55px;
      color: #FFFFFF;
      margin-bottom: 20px;
    }

    footer .footer-third-col p{
      font: normal normal normal 16px/25px Quicksand;
      letter-spacing: 0.5px;
      color: #FFFFFF;
    }

      footer .footer-third-col p.links{
        margin-top: 20px;
      }

        footer .footer-third-col p.links a{
          font: normal normal normal 16px/28px Quicksand;
          letter-spacing: 0.5px;
          color: #FFFFFF;
          margin-top: 25px;
        }

@media (min-width: 769px) and (max-width: 1024px) {

  .before-footer{
    height: 300px;
  }

  footer .footer-second-col{
    margin-top: 30px;
    margin-bottom: 30px;
  }

  footer .footer-second-col .horaires{
    margin-left: 15px;
    margin-right: 15px;
  }

  footer .footer-third-col{
    padding-left: 15px;
  }

  footer .footer-first-col{
    padding-left: 25px;
  }

}

@media (min-width: 481px) and (max-width: 768px) {

  .before-footer{
    height: 230px;
  }

  footer .footer-second-col{
    margin-top: 30px;
    margin-bottom: 30px;
  }

  footer .footer-second-col .horaires{
    margin-left: 15px;
    margin-right: 15px;
  }

  footer .footer-third-col{
    padding-left: 15px;
  }

  footer .footer-first-col{
    padding-left: 25px;
  }

}


@media (max-width: 480px) {

  .before-footer{
    height: 230px;
  }

  footer .footer-second-col{
    margin-top: 30px;
    margin-bottom: 30px;
  }

  footer .footer-second-col .horaires{
    margin-left: 15px;
    margin-right: 15px;
    text-align: center;
  }

  footer .contact-col{
    margin-bottom: 30px;
  }

  footer .footer-third-col{
    padding-left: 15px;
  }

  footer .footer-first-col{
    padding-left: 25px;
  }

  footer .footer-first-col p{
    margin-bottom: 30px;
  }

}