@font-face {
    font-family: 'montserrat_black';
    src: url('../fonts/montserrat-black-webfont.eot');
    src: url('../fonts/montserrat-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/montserrat-black-webfont.woff') format('woff'),
         url('../fonts/montserrat-black-webfont.ttf') format('truetype'),
         url('../fonts/montserrat-black-webfont.svg#open_sans_extrabold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'montserrat_light';
    src: url('../fonts/montserrat-light-webfont.eot');
    src: url('../fonts/montserrat-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/montserrat-light-webfont.woff') format('woff'),
         url('../fonts/montserrat-light-webfont.ttf') format('truetype'),
         url('../fonts/montserrat-light-webfont.svg#open_sans_extrabold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'karla_regular';
    src: url('../fonts/karla-regular-webfont.eot');
    src: url('../fonts/karla-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/karla-regular-webfont.woff') format('woff'),
         url('../fonts/karla-regular-webfont.ttf') format('truetype'),
         url('../fonts/karla-regular-webfont.svg#open_sans_extrabold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'karla_bold';
    src: url('../fonts/karla-bold-webfont.eot');
    src: url('../fonts/karla-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/karla-bold-webfont.woff') format('woff'),
         url('../fonts/karla-bold-webfont.ttf') format('truetype'),
         url('../fonts/karla-bold-webfont.svg#open_sans_extrabold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.element_from_left {opacity:0;left:-100px;}
.element_from_right {opacity:0;right:-100px;}

#bodyHeader .logoSoc {text-align: center;padding: 10px 0px 20px 0px;;}
#bodyHeader .logoSoc img {width: 25%;animation-name: infinite bounce delay-2s;}
#bodyHeader .slogan {font-family: montserrat_black;color: #5ba146;text-align: center;font-size: 16px;position: absolute;left: 0;right: 0;bottom: 0;}

#banniere {padding: 0px 0px 20px;}
#banniere .bandMachine {background-color: #5ba146;padding: 0px 60px;}
#banniere .bandExplic {background-color: #7cb46b;padding: 0px 60px;} 
#banniere .contGauche p {font-family: montserrat_black;font-size: 18px;color: white;padding: 20px 0px 20px 50px;margin-right: -15px;}
#banniere .lienScroll {font-family: karla_bold;font-size: 12px;color: white;background-color: #5ba146;border-style: solid;border-width: 1px;padding: 7px;margin-left: 50px;text-decoration: none;display: block;width: 75%;text-align: center;margin-bottom: 15px;transition: color 0.25s ease-in, background 0.25s linear;}
#banniere .lienContact {font-family: karla_bold;font-size: 12px;color: #5ba146;background-color: white;border-color: white;padding: 7px;margin-left: 50px;text-decoration: none;display: block;width: 75%;text-align: center;margin-bottom: 15px;border-style: solid;border-width: 1px;transition: color 0.25s ease-in, background 0.25s linear;}
#banniere .lienScroll:hover {color: #5ba146;background-color: white;transition: color 0.25s ease-in, background 0.25s linear;}
#banniere .lienContact:hover {color: white;background-color: #5ba146;transition: color 0.25s ease-in, background 0.25s linear;}
#banniere .machineImg {width: 85%;padding: 15px 0px;margin-left: -15px;}
#banniere .explication p {font-family: karla_regular;font-size: 12px;color: white;padding: 20px 50px;text-align: justify;}

#galerie {padding: 20px 60px;}
#galerie .banImg img {width: 100%;padding-left: 50px;}
#galerie .banTxt {padding: 0px 65px 0px 15px;}
#galerie h3 {font-family: montserrat_black;font-size: 14px;color: #5ba146;} 
#galerie p {font-family: karla_regular;font-size: 12px;text-align: justify;} 
#galerie .banTxt iframe {width: 50%;}
#galerie iframe {padding: 15px;border: none;}

#contact {padding: 20px 0px 0px;margin: 20px 125px;border-style: solid;border-width: 1px;border-color: #5ba146;}
#contact .blocContact {padding: 0px 50px;}
#contact .conTitre {padding: 0;text-align: center;text-transform: uppercase;font-family: montserrat_light;font-size: 16px;}
#contact .conTitre hr {width: 50%;}
#contact .conTitre strong {font-family: montserrat_black;}
#contact input {width: 100%;padding: 10px;margin-bottom: 15px;}
#contact textarea {width: 100%;padding: 10px;margin-bottom: 15px;height: 150px;}
#contact .conBas {padding: 0;text-align: center;font-family: montserrat_light;font-size: 10px;margin-top: 20px;}
#contact .g-recaptcha {float: right;}
#contact input[type="submit"] {color: white;background-color: #5ba146;border-style: solid;border-width: 1px;border-color: #5ba146;text-decoration: none;width: 75%;margin-top: 15px;transition: color 0.25s ease-in, background 0.25s linear;}
#contact input[type="submit"]:hover {color: #5ba146;background-color: white;transition: color 0.25s ease-in, background 0.25s linear;}
#contact p.warning {background: #fd7e14;color: white;padding: 10px 0;text-align: center;}
#contact p.success {background: #28a745;color: white;padding: 10px 0;text-align: center;}


#footerIcon .icon50 img {width: 50px;height: auto;}
#footerIcon .icon50 p {font-family: karla_regular;text-align: center;}
#footerIcon {padding: 0;margin: 0;} 
#footerIcon .rowIcon {text-align: center;padding: 30px 0px;} 
#footerIcon .rowIcon .appIconBt {padding: 10px;} 
#footerIcon .rowIcon .appIconImg {width: 30px;transition: transform 0.8s;}
#footerIcon .rowIcon .appIconImg:hover {transform: scale(1.5) rotateZ(1turn);}

#footer {padding: 0;margin: 0;} 
#footer a {font-size: 12px;color: black;}
#footer .dsoft {text-align: center;background-color: white;padding-bottom: 15px;padding-top: 15px;}
#footer .dsoft span {font-size: 10px;color: black;}
#footer .dsoft img {width: 5%;transition: transform 0.8s;}
#footer .dsoft a:hover {text-decoration:none;}

@media (max-width: 1267px) {
}
@media (max-width: 1199px) {
}
@media (max-width: 1087px) {
}
@media (max-width: 991px) {
}
@media (max-width: 847px) {
}
@media (max-width: 767px) {
    #bodyHeader .logoSoc {padding: 10px 0px;}
    #bodyHeader .logoSoc img {width: 75px;}
    #bodyHeader .slogan {font-size: 14px;position: unset;}
    #banniere .contGauche p {font-size: 16px;padding: 0px 0px;margin-right: 0px;text-align: center;}
    #banniere .lienScroll {font-size: 10px;padding: 7px;margin-left: 0px;width: 100%;}
    #banniere .lienContact {font-size: 10px;padding: 7px;margin-left: 0px;width: 100%;}
    #banniere .machineImg {width: 100%;padding: 15px 0px;margin-left: 0px;}
    #banniere .explication p {font-size: 10px;padding: 10px 0px;}
    #galerie {padding: 0px 60px;}
    #galerie .banImg img {padding-left: 0px;}
    #galerie .banTxt {padding: 10px;}
    #galerie h3 {font-size: 12px;} 
    #galerie p {font-size: 10px;} 
    #contact {padding: 0px;margin: 0px;}
    #contact input {padding: 5px;margin-bottom: 5px;}
    #contact textarea {padding: 5px;margin-bottom: 5px;}
    #contact .g-recaptcha {float: left;}
    #contact input[type="submit"] {width: 100%;}
    #footerIcon {margin: 20px 0px 0px 0px;} 
}
@media (max-width: 575px) {
}
@media (max-width: 460px) { 
}