@import url('https://fonts.googleapis.com/css?family=Roboto|Source+Sans+Pro');
@import url('https://fonts.googleapis.com/css?family=Poppins:400,600');

/* Reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

html {
    font-family: 'Roboto', 'Arial', 'sans-serif';
    font-size: 100%;
    background-color: white;
    word-break: keep-all;
}

body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
/* Fin Reset */


h1 {
    font-family: 'Poppins', 'Arial', 'sans-serif';
    font-size: 26px;
    line-height: 30px;
    font-weight: 400;
    color:#4daae0;
    text-transform: uppercase;
}

h2 {
    font-family: 'Poppins', 'Arial', 'sans-serif';
    font-size: 20px;
    line-height: 30px;
    font-weight: 400;
    color: #22282b;
    text-transform: uppercase;
}

h3 {
    font-family: 'Poppins', 'Arial', 'sans-serif';
    font-size: 18px;
    font-weight: 300;
    line-height: 24px;
    color: #22282b;
}

h4 {
    font-family: 'Poppins', 'Arial', 'sans-serif';
    font-size: 16px;
    font-weight: 300;
    color: #22282b;
}

p {
    font-family: 'Roboto', 'Arial', 'sans-serif';
    font-size: 15px;
    line-height: 23px;
    color:#595858;
    font-weight: 400;
}

a {
    text-decoration: none;
    color:#22282b;
}

strong {
    font-weight: bold !important;
}

b {
    font-weight: bold;
}

em {
    font-style: italic;
}




/**
 * BOUTONS ACTION
 */
.button {
    padding:15px;
    border-radius: 5px;
    border:1px solid transparent;
    color:#22282b;
    background-color:#eee;
    display: inline-block;
    transition: all 300ms linear 0s;
    text-align: center;
    width:100%;
    margin:0 0 20px 0;
}

.button:hover {
    background-color:transparent;
    color:#22282b;
    border:1px solid #22282b;
}

.blue-button {
    background-color:#4daae0;
    color:#FFF;
}

.blue-button:hover {
    background-color:transparent;
    color:#4daae0;
    border:1px solid #4daae0;
    text-decoration: none;
}







.partenaires {
    margin-top:20px;
    padding:20px 0;
    border-top: 25px solid #4daae0;
}

.partenaires .partenaires-item a {
    display:inline-block;
}






/**
 * FOOTER
 */
footer {
    /*margin-top: 30px;*/
    border-top:1px solid #f1f1f2;
}

.footer-menu-container {
    padding:20px 0 8px 0;
    background-color: #f7f7f7;
}

footer nav h4,
footer nav h6 {
    text-transform: uppercase;
    margin-bottom:15px;
    padding:0 0 15px 0;
    position:relative;
    font-size: 13px;
    color:#22282b;
}

footer nav h4:after,
footer nav h6:after {
    content: "";
    border-bottom: 3px solid rgba(30,40,43,237);
    opacity: 1;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 15%;
}

footer nav a {
    font-size: 14px;
}

footer nav ul{
    padding:10px 0 30px 0px;
}

footer nav ul li{
    padding:7px 0px;
    font-size: 15px;
}

footer nav a:hover {
    text-decoration: underline;
    color:#22282b;
}

footer nav .has-child {
    position:relative;
}

footer nav .has-child i {
    position:absolute;
    right:20px;
}

footer nav .has-child .children {
    padding-left:20px;
    padding-top:8px;
    padding-bottom: 5px;
}

footer nav .has-child .children li {
    font-size: 14px;
    padding:3px 0;
}


.footer-social-container form{
    margin-top:30px;
}

.footer-social-container input[type=submit]{
    padding:12px;
    margin-top:0px;
}

.footer-social-container input[type=text]{
    margin-bottom: 10px;
}

.footer-social-container p{
    padding:7px 0;
    margin:0;
    text-align: center;
}

.footer-social-container a:hover {
    text-decoration: none;
    color:#737373;
}

.footer-social-container form{
    /*margin-bottom:30px;*/
}

.footer-end p{
    text-align: center;
    font-size: 12px;
}

.footer-end a:hover {
    color:#22282b;
}




#scroll-top a {
    position: fixed;
    right:32px;
    bottom:90px;
    padding:4px 8px 6px;
    background:#818c90;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius:4px;
    opacity: 0.9;
    filter: alpha(opacity=89);
    z-index: 2000;
    color:#FFF;
}





/**
 * HEADER PAGE, IMAGE, SLOGAN, BOUTON
 */
header {
    /*height:36vh;*/
}

header .top-info {
    min-height:38px;
    background-color: #4daae0;
    padding-left:10px;
    padding-right:10px;
}

header .top-info p {
    color:#FFF;
    font-size: 14px;
    line-height: 38px;
}

header .top-info a {
    background-color: #FFF;
    color:#4daee0;
    padding:5px;
    border-radius: 5px;
}

header .order-nav {
    min-height:49px;
    background-color: #fff;
    padding-left:10px;
    padding-right:10px;
    padding-top: 11px;
}

header .order-nav p {
    line-height: 38px;
}

header .order-nav p.profil-icon {
    text-align: right;
}

header .order-nav p.logo {
    text-align: left;
}

header .order-nav p > a > i.fa {
    /*font-size: 24px;*/
    padding-left: 5px;
    padding-right: 5px;
    line-height: 38px;
    color:#4daae0;
}

header .order-nav p > a:hover {
    text-decoration: none;
}

header .order-nav form.navbar-form {
    margin-top: 5px;
}

header .top-nav .navbar {
    margin-bottom: 0px;
}



header .image_header {
    height:36vh;
    position:absolute;
    width:100%;
}

header .image_header img {
    height:36vh;
    width:100%;
    object-fit:cover;
    overflow: hidden;
}


header.header-product,
header.header-profil {
    height:36vh;
}

header.header-product .image_header,
header.header-profil .image_header {
    height:36vh;
    position:absolute;
    width:100%;
}

header.header-product .image_header img,
header.header-profil .image_header img {
    height:36vh;
    width:100%;
    object-fit:cover;
    overflow: hidden;
}

/* Fallback pour IE */
header .compat-object-fit {
    background-size: cover;
    background-position: center;
}
header .compat-object-fit img {
    opacity: 0;
}

header .header-slogan {
    height:100%;
    text-align: center;
}

header .header-slogan .slogan-container {
    top:36%;
    position:relative;
}

header.header-product .header-slogan .slogan-container {
    top:45%;
    position:relative;
}

header .header-slogan h1, header .header-slogan p, header.header-product .header-slogan h2 {
    font-family: "Roboto", "Arial", "sans-serif";
    font-size: 20px;
    font-weight: bold;
    color:#FFF;
    line-height: 22px;
}

header .header-slogan .slogan-button {
    background-color:#4daae0;
    padding:10px 15px;
    border-radius: 5px;
    border:1px solid transparent;
    color:#FFF;
    display: inline-block;
    margin-top:10px;
    transition: all 300ms linear 0s;
    font-size: 15px;
}

header.header-product .header-slogan .slogan-button,
header.header-profil .header-slogan .slogan-button {
    background-color:#4daae0;
    padding:15px;
    border-radius: 5px;
    border:1px solid transparent;
    color:#FFF;
    text-transform: uppercase;
    display: inline-block;
    margin-top:30px;
    transition: all 300ms linear 0s;
}

header .header-slogan .slogan-button:hover {
    background-color:transparent;
    color:#fff;
    border:1px solid #fff;
    text-decoration: none;
}

header #slider img {
    min-width:100%;
}






.home {
    padding-top:20px;
}

.home .introduction {
    margin-bottom:40px;
}

.home h1 {
    margin-bottom:10px;
}

.home .products {
    text-align: center;
}

.home .products h3 {
    color:#4daae0;
}

.home .products p {
    color:#22282b;
}

.home .products img {
    max-width: 100%;
}

.home .products .product {
    margin-bottom: 30px;
}

.home .products .product p.price {
    color:#4daae0;
    font-weight:bold;
}

.home .products .product .product-media {
    max-width: 300px;
    display: inline-block;
}

.home .products .product .product-media .btn {
    margin-top: -100px;
    width:80%;
}

.home .products .product .product-media .btn:hover,
.home .products .product .product-media .btn:active,
.home .products .product .product-media .btn:focus {
    border:1px solid #FFF;
    background-color: #FFF;
    color:#4daae0;
}

.home .support h2 {
    font-size: 26px;
    line-height: 30px;
    color:#4daae0;
    margin-bottom:10px;
}

.home .support h3 {
    font-size: 20px;
    line-height: 30px;
    color:#22282b;
    text-transform: uppercase;
}

.home .support .support-parts {
    margin-top:40px;
    margin-bottom: 40px;
}

.home .support .support-parts .support-part {
    margin-bottom:20px;
}

.home .support .support-parts img {
    max-width:100%;
}

.home .support .support-parts i.fas {
    color:#4daae0;
    margin-bottom: 20px;
}

.home .product .product-media .blue-button:hover,
.home .product .product-media .blue-button:focus,
.home .product .product-media .blue-button:active {
    background-color:transparent;
    color:#FFF;
    border:1px solid #FFF;
    text-decoration: none;
}




.products h2 {
    margin-bottom:20px;
}

.products .sp-wrap {
    max-width: 400px;
}

.products .product-carousel .product {

}

.products .product-carousel .product h4,
.products .product-carousel .product h4 a {
    color:#4daae0;
    font-size: 20px;
    line-height: 24px;
}

.products .product-carousel .product p {
    color:#22282b;
    font-size: 16px;
}

.products .product-carousel .product img {
    max-width: 100%;
}

.products .product-carousel .product {
    margin-bottom: 30px;
}

.products .product-carousel .product .product-media {
    max-width: 300px;
    display: inline-block;
}

.products .product-carousel .product .product-media .btn {
    margin-top: -80px;
    width:80%;
}


.gamme .sidebar {
    background-color: #f7f7f7;
    padding:10px 20px;
}

.gamme .sidebar h2 {
    margin-bottom:10px;
}

.gamme .sidebar ul.filters {
    margin-bottom:30px;
}



.gamme .sidebar .categorie-item li {
    display: block;
}

.gamme .sidebar .categorie-item li i.fa-arrow-right {
    font-size: 12px;
}

.gamme .sidebar .categorie-item button {
    display: inline-block;
    padding: 5px 10px;
    cursor: pointer;
    text-decoration: underline;
    border:none;
    background-color:#f7f7f7;
}

.gamme .sidebar .categorie-item button:hover {
    color:#4daae0;
    text-decoration: none;
}

.gamme .sidebar .categorie-item button.active {
    color:#4daae0;
    text-decoration: none;
}

.gamme #grid .product  {
    display: none;
    opacity: 0;
}

.gamme #grid .product a  {
    color:#22282B;
    text-decoration: none;
}

.gamme #grid .product a:hover,
.gamme #grid .product a:focus,
.gamme #grid .product a:active  {
    color:#4DAAE0;
}



/* TABULATION PAGE PRODUIT */
.produit .content nav {
    background-color: #f7f7f7;
}

.produit .content nav ul li {
    display:inline-block;
    padding:20px;
    color:#22282b;
    cursor:pointer;
}

.produit .content nav ul li a:hover {
    color:#22282b;
    text-decoration: none;
}

.produit .content nav ul li:hover,
.produit .content nav ul li:focus,
.produit .content nav ul li:active {
    border-bottom: 2px solid #4daee0;
    color:#22282b;
}

.produit .content nav ul li:hover a,
.produit .content nav ul li:focus a,
.produit .content nav ul li:active a,
.produit .content nav ul li a:hover,
.produit .content nav ul li a:focus,
.produit .content nav ul li a:active {
    color:#22282b;
    text-decoration: none;
}

.produit .content nav ul li.active {
    border-bottom: 2px solid #4daee0;
}

.produit .content .content-contenu {
    padding:20px 0;
}

.produit .content .content-contenu .tab-item {
    border-left:1px solid #737373;
    padding-left: 20px;
    font-family: 'Roboto', 'Arial', 'sans-serif';
    font-size: 15px;
    font-weight: 400;
    line-height: 23px;
    color: #595858;
}

.produit .content .content-contenu .tab-item ul li {
    list-style: inside;
}

.produit .content .content-contenu iframe {
    max-width: 100%;
}

.produit .media-container {
    margin-bottom: 60px;
    text-align: center;

}

.produit .media-container img {
    max-width:400px;
    border:1px solid #8A8A8A;
}



.produit .products {
    margin-top:10px;
    margin-bottom:20px;
}

.produit .products .product-carousel .product-media img {
    max-width:100%;
    margin-bottom:10px;
    margin-left: auto;
    margin-right: auto;
}

.produit .products .product-carousel h4 {
    margin-bottom: 8px;
    padding:0 15px;
}

.produit .products .product-carousel h4 a {
    color:#4daae0;
    font-size: 18px;
}

.produit .products .product-carousel p {
    line-height: 18px;
    margin-bottom: 10px;
    padding:0 15px;
}

.produit .products .product-carousel p.price {
    color:#4daae0;
    font-size: 20px;
}

.produit #sidebar .sidebar-content p > i.fa-truck-moving,
.produit #sidebar .sidebar-content p > i.fa-lock {
    color:#4daae0;
    margin-bottom: 10px;
}

.produit #sidebar h2 {
    margin-bottom:5px;
    text-transform: none;
}

.produit #sidebar h3 {
    font-size: 16px;
    line-height: 20px;
}

.produit #sidebar p.reference {
    font-size: 12px;
    line-height: 16px;
    padding: 3px 0;
}

.produit #sidebar .review p {
    font-size: 14px;
}

.produit #sidebar .review {
    margin-bottom: 15px;
}

.produit #sidebar form label {
    margin-bottom: 5px;
    font-size: 14px;
}

.produit #sidebar p.price {
    color:#4daae0;
    font-size: 24px;
    margin-top:10px;
}

.produit #sidebar p.stock {
    font-size: 15px;
    font-style: italic;
    margin-bottom:10px;
}

.produit #sidebar p.conseil,
.produit #sidebar p.livraison {
    font-size: 15px;
    line-height: 17px;
}




.espace-client h2 {
    margin-bottom:20px;
}

.espace-client form {
    text-align: left;
}

.espace-client form label {
    font-size: 14px;
    margin-bottom:5px;
}



/* NAVIGATION ESPACE CLIENT */
.espace-client ul.navigation {

}

.espace-client ul.navigation li {
    padding:10px;
}

.espace-client ul.navigation li > a {
    display:block;
    background-color: #f7f7f7;
    padding:20px 10px;
    border-radius: 8px;
    color:#22282b;
}

.espace-client ul.navigation li > a.active {
    color:#4daae0;
}

.espace-client ul.navigation li > a.active > i.fas {
    color:#4daae0;
}

.espace-client ul.navigation li > a:hover,
.espace-client ul.navigation li > a:active,
.espace-client ul.navigation li > a:focus {
    color:#4daae0;
    text-decoration: none;
}

.espace-client ul.navigation li > a > i.fas {
    color:#22282b;
}

.espace-client ul.navigation li > a:hover > i.fas,
.espace-client ul.navigation li > a:active > i.fas,
.espace-client ul.navigation li > a:focus > i.fas {
    color:#4daae0;
}




/* TAB MENU PROFIL ESPACE CLIENT */
.espace-client .tab-menu {
    text-align: center;
    margin-bottom: 30px;
}

.espace-client .tab-menu li {
    display: inline-block;
    font-size: 15px;
    padding:15px 20px;
    color:#FFF;
    background-color: #4daae0;
    border:1px solid #4daae0;
    border-left:1px solid #FFF;
    cursor:pointer;
}

.espace-client .tab-menu li:first-child {
    border-radius: 50px 0px 0px 50px;
    border-left:1px solid #4daae0;
    border-right:1px solid #4daae0;
}

.espace-client .tab-menu li:last-child {
    border-radius: 0px 50px 50px 0px;
    border-right:1px solid #4daae0;
}

.espace-client .tab-menu li.ui-state-active {
    background-color: #fff;
    color:#4daae0;
    cursor: default;
}

.espace-client .tab-menu li.ui-state-active + li {
    border-left:#4daae0;
}

.espace-client .tab-menu li + li.ui-state-active {
    border-left:#4daae0;
}

.espace-client .tab-menu li.ui-state-active a,
.espace-client .tab-menu li.ui-state-active a:focus,
.espace-client .tab-menu li.ui-state-active a:active,
.espace-client .tab-menu li.ui-state-active a:hover {
    color:#4daae0;
    border:none;
}

.espace-client .tab-menu li a,
.espace-client .tab-menu li a:active,
.espace-client .tab-menu li a:focus,
.espace-client .tab-menu li a:hover {
    color:#FFF;
    text-decoration: none;
    border:none;
}

.espace-client .tab-menu .tabs {
    margin-bottom: 30px;
}





/* RECHERCHE AUTOCOMPLETE */
ul.ui-autocomplete {
    background-color:#FFF;
    padding:10px;
    z-index:9999 !important;
}

ul.ui-autocomplete > li.ui-menu-item {
    padding:8px 0;
    cursor:pointer;
}

ul.ui-autocomplete > li.ui-menu-item:hover {
    color:#4daae0;
}






/* PARCOURS D'ACHAT PROGESS LINE */
.clearfix {
    zoom: 1;
}

.clearfix:before, .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    overflow: hidden;
}

.clearfix:before, .clearfix:after {
    content: " ";
    display: table;
}

.espace-client ul.step {
    overflow: hidden;
    margin-bottom:20px;
}

.espace-client ul.step li a,
.espace-client ul.step li span,
.espace-client ul.step li.step_current span,
.espace-client ul.step li.step_current_end span {
    display: block;
    padding: 13px 10px 14px 18px;
    color: #22282b;
    font-size: 15px;
    text-transform: uppercase;
    line-height: 21px;
    letter-spacing: 0.1pt;
    position: relative;
    cursor:pointer;
    text-align: center;
}

.espace-client ul.step li a p {
    color:#22282b;
}

.espace-client ul.step li.first {
    border-left-width: 1px;
    border-left-color: #b7b7b7;
}

.espace-client ul.step li {
    float: left;
    width: 25%;
    text-align: left;
    border: 1px solid;
    border-top-color: #dadada;
    border-bottom-color: #dadada;
    border-right-color: #dadada;
    border-left-width: 0px;
}

.espace-client ul.step li.step_current,
.espace-client ul.step li.step_current_end {
    background-color: #4daee0;
    color:#FFF;
}

.espace-client ul.step li.step_current_end a p {
    color:#FFF;
}

.espace-client ul.step li.step_current a {
    padding-left: 18px;
}

.espace-client ul.step li.step_current span,
.espace-client ul.step li.step_current a,
.espace-client ul.step li.step_current_end span,
.espace-client ul.step li.step_current_end a {
    color: white;
    position: relative;
}

.espace-client ul.step li.step_current a p {
    color:#FFF;
}

.espace-client ul.step li.first span,
.espace-client ul.step li.first a {
    z-index: 5;
}


.espace-client ul.step li.step_current a:after {
    background: url(../images/pros/arrowNextCart.png) right center no-repeat;
    visibility: visible;
    margin-top: -45px;
}


.espace-client ul.step li.step_current a:after {
    margin-top: 0!important;
}

.espace-client ul.step li a:after,
.espace-client ul.step li span:after,
.espace-client ul.step li.step_current span:after,
.espace-clientul.step li.step_current_end span:after {
    content: ".";
    position: absolute;
    top: 0;
    right: -14px;
    z-index: 0;
    text-indent: -5000px;
    display: block;
    width: 14px;
    height: 52px;
    margin-top: -2px;
}

.espace-client ul.step li.step_todo {
    background: #fff;
}

.espace-client ul.step li.step_todo span {
    padding-left: 70px;
}

.espace-client ul.step li.step_todo a {
    display: block;
    color: #22282b;
    position: relative;
}

.espace-client ul.step li.third span, ul.step li.third a {
    z-index: 3;
}

.espace-client ul.step li.step_todo a:after {
    background: url(../images/pros/arrowNextCartTodo.png) right center no-repeat;
    visibility: visible;
}


/**
 * BARRE DE NAVIGATION
 */
 /*
header nav ul li {
    display: block;
    padding:8px 5px;
    cursor:pointer;
}*/


.navbar-b2b, .navbar {
    background-color: #FFF;
    border-top: 1px solid #4daae0;
    border-bottom: 1px solid #4daae0;
}

.navbar-b2b .nav > li > a:hover {
    color:#FFF;
    font-size:16px;
    background-color:#4daae0;
}


.navbar-b2b .nav > li > a {
    color:#22282b;
    border-top:2px solid transparent;
    font-size:16px;
}

.navbar-b2b .nav > li > a:hover,
.nav > li > a:focus {
    /*border-top:2px solid #4daae0 !important;*/
    color:#FFF;
    background-color:#4daae0 !important;
}

.navbar-b2b .nav > li ul.dropdown-menu li a:hover,
.nav > li ul.dropdown-menu li a:focus {
    background-color:transparent !important;
}

.nav > li > a:focus
{
    border-top:2px solid #4daae0 !important;
    background-color:transparent !important;
}

.collapse.in {
    background-color: #FFF;
}

.collapse.in .nav > li > a {
    color:#22282b;
    border:none !important;
}

.collapse.in .nav > li > a:hover, .collapse.in .nav > li > a:focus {
    border:none !important;
}

.navbar-brand {
    height:56px;
}

.navbar-b2b .nav > li ul.dropdown-menu {
    padding:6px 4px;
}

.navbar-b2b .nav li ul.dropdown-menu li {
    padding: 5px 0;
}

.navbar-b2b .nav li ul.dropdown-menu li:hover {
    background-color: transparent;
}

.navbar-b2b .nav .open .highlighted {
    background-color: transparent;
}

.dropdown-menu > li > a {
    color:#22282b;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    background-color: transparent;
    text-decoration: underline;
}

.navbar-toggle {
    background-color: #fff;
    margin-top:10px;
    margin-bottom: 10px;
}

.navbar-toggle .icon-bar {
    background-color: #22282b;
}

.navbar-nav {
    display:table;
    float:none;
    margin:0 auto;
    width:100%;
}

.navbar-nav li {
    display:inline-block;
    float:none;

}










/**
 * BARRE NAVIGATION GAMMES
 */
.gamme-container {
    margin-bottom: 80px;
}

.gamme-container ul {
    text-align: center;
    height:14vh;
}

.gamme-container ul li {
    display:inline-block;
    height:95%;
    border-bottom: 2px solid #ddd;
    margin:0 5px;
}

.gamme-container ul li:hover,
.gamme-container ul li:focus,
.gamme-container ul li:active,
.gamme-container ul li.active {
    border-bottom: 2px solid #4daae0;
}

.gamme-container ul li a {
    display:inline-block;
    line-height:14vh;
    font-size: 18px;
    padding:0 30px;
}

.gamme-container ul li:hover a,
.gamme-container ul li:focus a,
.gamme-container ul li:active a,
.gamme-container ul li a.active {
    color:#4daae0;
    text-decoration: none;
}










.pagination-container {
    /*height:34px;*/
    text-align:right;
    margin: 0 0 50px 0;
}

ul.pagination {
    margin:0;
}

ul.pagination li {
    display:inline-block;
}

ul.pagination li.active a {
    background-color: #4daae0;
    border:none;
    color:#fff;
}

ul.pagination li a {
    background-color: #fff;
    color:#4daae0;
    border:none;
    padding:10px;
    margin:0 0 0 1px;
    display:inline-block;
    font-family: 'Roboto', 'Arial', 'sans-serif';
    font-size: 13px;
    font-weight: 400;
}

ul.pagination li a:hover,
ul.pagination li a:active,
ul.pagination li a:focus {
    background-color: #4daae0;
    border:none;
    color:#FFF;
}





/*** BLOG HOME ***/
.blog .top-posts h2 {
    font-family:'Poppins', 'Arial', 'sans-serif';
    font-size:22px;
    color:#22282b;
    line-height:31px;
    font-weight:600;
}

.blog .top-posts hr {
    margin-bottom:40px;
    margin-top:16px;
}


/*** ARTICLE A LA UNE GAUCHE ***/
.blog .top-posts .big {
    margin-bottom:30px;
}


.blog .top-posts .big a .post-content {
    height:510px;
    background-position: center;
    position:relative;
}

.blog .top-posts .big a .post-content .title {
    position:absolute;
    bottom:0px;
    background-color:rgba(0,0,0,.3);
    padding:12px 10px;
    width:100%;
}

.blog .top-posts .big a .post-content .title time {
    font-family:'Roboto', 'Arial', 'sans-serif';
    font-size:11px;
    color:#FFF;
    line-height:23px;
}

.blog .top-posts .big a .post-content .title h3 {
    font-family:'Poppins', 'Arial', 'sans-serif';
    font-size:22px;
    color:#FFF;
    line-height:31px;
    font-weight:600;
    transition: all 100ms linear 0s;
}

.blog .top-posts .big a:hover .post-content .title h3 {
    padding-bottom:10px;
    border-bottom: 2px solid #FFF;
}


/*** ARTICLE A LA UNE DROITE ***/
.blog .top-posts .little {
    max-height:480px;
    margin-bottom:90px;
}

.blog .top-posts .little a .post-content {
    position:relative;
    height:250px;
    margin-bottom:10px;
    background-position: center;
}

.blog .top-posts .little a .post-content .title {
    position:absolute;
    bottom:0px;
    background-color:rgba(0,0,0,.3);
    padding:12px 10px;
    width:100%;
}

.blog .top-posts .little a .post-content .title time {
    font-family:'Roboto', 'Arial', 'sans-serif';
    font-size:11px;
    color:#FFF;
    line-height:23px;
}

.blog .top-posts .little a .post-content .title h3 {
    font-family:'Poppins', 'Arial', 'sans-serif';
    font-size:17px;
    color:#FFF;
    line-height:24px;
    font-weight:600;
    transition: all 100ms linear 0s;
}

.blog .top-posts .little a:hover .post-content .title h3 {
    padding-bottom:10px;
    border-bottom: 2px solid #FFF;
}




/*** BLOG HOME LISTE ***/
.blog .category-posts h2 {
    text-transform: none;
    font-weight: 600;
}

.blog .category-posts hr {
    margin-top:10px;
}


/*** LIGNE D'ARTICLES ***/
.blog .category-posts .post-row {
    margin-bottom:40px;
}

.blog .category-posts .post-row .post-item {
    margin-bottom:10px;
}

.blog .category-posts .post-row .post-item a .post-content {
    height:250px;
    background-position: center;
    position:relative;
}

.blog .category-posts .post-row .post-item a:hover,
.blog .category-posts .post-row .post-item a:focus,
.blog .category-posts .post-row .post-item a:active {
    color:#4daae0;
}

.blog .category-posts .post-row .post-item .title {
    border-bottom:1px solid #f1f1f1;
}

.blog .category-posts .post-row .post-item .title h3 {
    font-size:19px;
    line-height:28px;
    font-family:'Poppins', 'Arial', 'sans-serif';
    font-weight:600;
    color:#333;
    margin-top:20px;
}

.blog .category-posts .post-row .post-item .title p {
    font-size:15px;
    line-height:24px;
    font-family:'Roboto', 'Arial', 'sans-serif';
    font-weight:400;
    color:#595858;
    margin-top:15px;
    margin-bottom:21px;
}

.blog .category-posts .post-row .post-more p a {
    font-family: 'Roboto', 'Arial', 'sans-serif';
    font-size: 12px;
    color: #333;
    font-weight: 400;
}


/*** ARTICLE ***/
.article {
    margin-bottom:50px;
}

.article .header {
    margin-bottom:8px;
    margin-top:10px;
}

.article .header .header-img {
    min-height:560px;
    position:relative;
    background-position:50% 80%;
    background-repeat:no-repeat;
    background-size:cover;
}

.article .header .header-img .detail {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    padding: 23px 30px;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.7) 100%);
}

.article .header .header-img .detail h1 {
    color: #ffffff !important;
    font-weight: bold;
    font-size: 36px;
    margin-top: 15px;
    margin-bottom: 5px;
    font-family:'Poppins', 'Arial', 'sans-serif';
    line-height:48px;
    text-transform:none;
}

.article .header .header-img .detail .meta-info time {
    color:#fff;
    font-size:11px;
    font-family:'Poppins', 'Arial', 'sans-serif';
    font-weight:600;
    text-transform:uppercase;
}

.article .breadcrumb {
    padding-left:0px;
    margin-bottom:0px;
    margin-top:0;
}


.article #content img {
    max-width:100%;
    margin-top:20px;
    margin-bottom:10px;
}




/*** Product Navigation ***/
.product-navigation {
    min-height:8vh;
}

.product-navigation ul {
    text-align: center;
    min-height:8vh;
}

.product-navigation ul li {
    display:inline-block;
    height:8vh;
    margin:0;
}

.product-navigation ul li:hover,
.product-navigation ul li:focus,
.product-navigation ul li:active,
.product-navigation ul li.active {
   /* border-top:4px solid #4daae0; */
}

.product-navigation ul li a {
    display:inline-block;
    padding:23px 15px;
    color:#fff;
    text-transform: uppercase;
    background-color: #4daee0;
    transition: all 1s;
    width: 100%;
}

.product-navigation ul li a:hover {
    color:#4daae0;
    background-color:#fff;
    text-decoration: underline;
}

.product-navigation ul li a.active {
    color:#4daae0;
    background-color: #fff;

}

.product-navigation ul li:hover a,
.product-navigation ul li:focus a,
.product-navigation ul li:active a,
.product-navigation ul li a.active {
    text-decoration: none;
}



/*** ARTICLES BLOG ACCUEIL ***/
.post-boxed-container {
    background-color: #f7f7f7;
    padding:40px 0 0 0;
}

.post-boxed-container h2 {
    text-align: center;
    margin-bottom: 40px;
}

.post-boxed {
    transition: .3s;
}

.post-boxed:hover {
    -webkit-transform: translate3d(0, -8px, 0);
    transform: translate3d(0, -8px, 0);
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
}

.post-boxed:hover .post-boxed-body {
    border-color: transparent;
}

.post-boxed-image {
    display: block;
}

.post-boxed-image img {
    width: 100%;
    height:auto;
}

.post-boxed-title {
    position: relative;
    z-index: 1;
    padding: 10px 16px 0;
    margin: -25px 10px 0;
    background: #fff;
    color:#333333;
    font-size: 19px;
    line-height: 27px;
    font-weight: 600;
    font-family: 'Poppins', 'Arial', 'sans-serif';
}

.post-boxed-title a {
    display: inline;
}

.post-boxed-title a, .post-boxed-title a:active, .post-boxed-title a:focus {
    color: #22282b;
}

.post-boxed-title a:hover {
    color: #4daee0;
}

.post-boxed-body {
    /*border: 1px solid #e5e7e9;*/
    border-top-width: 0;
    transition: .22s;
    background-color: #FFF;
}

.post-boxed-meta {
    padding: 16px 26px;
}

.post-boxed-meta {
    position: relative;
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
    margin-bottom: -3px;
    font-size: 11px;
    color: #ababab;
    text-transform: uppercase;
}

.post-boxed-meta > * {
    margin-top: 3px;
}

.post-boxed-meta > *:not(:last-child) {
    margin-right: 15px;
}

.post-boxed-meta a, .post-boxed-meta a:active, .post-boxed-meta a:focus {
    color: #5c84b1;
}

.post-boxed-meta a:hover {
    color: #000;
}

.post-boxed-meta span {
    margin-right: .25em;
}

.post-boxed-meta li {
    display: inline-block;
}

.post-boxed-meta li:not(:last-child) {
    position: relative;
}

.post-boxed-meta li:not(:last-child):after {
    content: '';
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: -10px;
    width: 1px;
    height: 12px;
    background: #eee;
}



.post-list-container .post-boxed {
    margin-bottom: 50px;
}

.post-list-container .post-boxed .post-boxed-content {
    padding:10px 26px 0 26px;
}

.post-list-container .post-boxed .post-boxed-content p {
    /*font-size: 16px;
    color:#737373;
    line-height: 18px;*/
}





/*** ARTICLE ***/
.article #content h1 {
    color: #333333;
    font-size: 32px;
    font-weight: 600;
    font-family:'Poppins', 'Arial', 'sans-serif';
    letter-spacing: -0.5px;
    line-height:40px;
    text-transform:none;
    margin-top: 15px;
    margin-bottom: 5px;
}

.article #content h2 {
    margin: 7px 0px 20px 0px;
    letter-spacing: -0.5px;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    color: #333333;
    line-height: 1.4em;
    font-size: 26px;
    text-transform: none;
}

.article #content p {
    line-height: 27px;
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    color: #595858;
    font-weight:400;
}

.article #content p a {
    text-decoration: underline;
}

.article #content p a:hover {
    text-decoration: none;
    color:#4daae0;
}

.article #content p strong,
.article #content p em {
    font-weight: 600;
}

.article #content ul li {
    line-height: 27px;
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    color: #595858;
    font-weight:400;
    list-style: inside;
}









.sidebar {
    padding-top:40px;
}

.sidebar .widget {
    margin-bottom: 40px;
}

.sidebar .widget h3,
.sidebar .widget h5 {
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 8px;
    font-size: 18px;
    font-weight: 300;
    line-height: 24px;
    color: #22282b;
}

.sidebar .widget h3:after,
.sidebar .widget h5:after {
    content: "";
    border-bottom: 3px solid rgba(30,40,43,237);
    opacity: 1;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 15%;
}

.sidebar .widget ul {
    padding-left:14px;
}

.sidebar .widget ul li {
    padding:5px 0;
    list-style:none;
}

.sidebar .widget ul li a:hover,
.sidebar .widget ul li a:focus,
.sidebar .widget ul li a:active {
    text-decoration: none;
    color: #4daae0;
}




/*** FIL D'ARIANE ***/

.breadcrumb {
    padding: 8px 15px;
    margin-bottom: 0px;
    list-style: none;
    margin-top: 30px;
    font-size: 12px;
    font-family: 'Roboto', 'Arial', 'sans-serif';
    border-radius: 0px;
    background-color: #FFF;
}

.breadcrumb > .active {
    color:#8a8a8a;
}

.breadcrumb > li + li::before {
    font-family: Verdana;
    font-size: 1em;
    content: "\203A";
    margin-left: 5px;
    margin-right: 5px;
}

.breadcrumb > li > a:hover,
.breadcrumb > li > a:focus,
.breadcrumb > li > a:active {
    color:#8a8a8a;
}



/*** MEGAMENU ***/
.menu-container {
    width:100%;
    background:#FFF;
    /*border-top:1px solid #4daae0;*/
    border-bottom:1px solid #4daae0;
}

.menu > ul > li {
    background:#FFF;
}

.menu > ul > li:hover {
    background:#F7F7F7;
}

.menu > ul > li > a:hover,
.menu > ul > li > a:active,
.menu > ul > li > a:focus {
    color:#22282b;
}

.menu > ul > li > ul {
    background:#F7F7F7;
}

.menu > ul > li > ul > li > a {
    color:#22282b;
}




/*** BLOG ***/
.blog .top-posts h2 {
    font-size: 18px;
    text-transform: none;
    font-weight: 400;
}

.blog .top-posts h3 {
    font-size: 18px;
    text-transform: none;
    font-weight: 400;
    color:#FFF;
}

.blog .top-posts hr {
    border-top:1px solid #22282b;
    margin-top: 10px;
}

.blog .top-posts .top-post .top-post-information {
    text-align:left;
    color:#FFF;
    padding:20px 10px;
    background-color: rgba(0,0,0,.3);
    position: absolute;
    bottom:0px;
    width:100%;
}

.blog .top-posts .top-post .top-post-information time {
    font-size: 14px;
}

.blog .top-posts .top-post a {
    color:#FFF;
    text-decoration: none;
}

.blog .top-posts .top-post {
    position:relative;
    margin-bottom:10px;
}

.blog .top-posts .top-post img {
    max-height:100%;
}

.blog .top-posts .top-post:hover .top-post-information {
    /*border-bottom:2px solid #737373;*/
}

/*** FAQ ***/
.faq {
  margin:18px auto;
}

.faq h1 {
  margin:42px auto;
  text-align:center;
}

.faq .theme {
  border:3px #4daae0 solid;
  border-radius:23px;
  margin-bottom:18px;
}

/**
 * MENTIONS LEGALES
 */
.mentions-legales {
    padding-top:50px;
}

.mentions-legales section {
	/*margin-bottom: 6rem;*/
}

.mentions-legales h2 {
	text-align: center;
	margin-top: 80px;
	margin-bottom: 20px;
    font-size: 24px;
    line-height: 34px;
}

.mentions-legales h3 {
    margin-bottom: 14px;
    font-size: 20px;
}

.mentions-legales h2:first-child {
    margin-top:0;
}

.mentions-legales ul {
    margin-bottom: 40px;
}

.mentions-legales ul li {
    font-family: 'Source Sans Pro', 'Arial', 'sans-serif';
    font-size: 18px;
    line-height: 28px;
    color:#737373;
}

.mentions-legales strong{
	font-weight: bold;
}

/**
 * PLAN DU SITE
 */
 .sitemap {
     padding-top:50px;
 }

 .sitemap article{
 	margin-bottom: 6rem;
 }

 .sitemap h2{
 	font-size: 2rem;
 	font-weight: bold;
 	line-height: 3rem;
 	text-align: center;
 	margin-top: 3rem;
 	margin-bottom: 3rem;
 }

 .sitemap h3{
 	font-size: 1.5rem;
 	line-height: 3rem;
 	text-align: center;
 	margin-top: 2rem;
 	margin-bottom: 3rem;
 }

.sitemap h3 a{
	color:#4daae0;
}

 .sitemap h4{
 	font-size: 1.3rem;
 	line-height: 3rem;
 	text-align: center;
 	margin-top: 1rem;
 	margin-bottom: 1rem;
 }

 .sitemap li{
 	font-size: 1.2rem;
	text-align: center;
	margin-top: 0.5rem;
 	margin-bottom: 0.5rem;
 }

/**
*QUI SOMME NOUS
**/
.qui_somme_nous article{
  margin:23px auto;
}

.qui_somme_nous article h1{
  margin-bottom:42px;
}

.qui_somme_nous article li {
  list-style:square inside;
  margin:7px auto;
	font-family: 'Roboto', 'Arial', 'sans-serif';
	font-size: 15px;
	line-height: 23px;
	color: #595858;
	font-weight: 400;
}

.qui_somme_nous article .gamme li {
  margin:42px auto;
}

.qui_somme_nous article p {
  margin:23px auto;
}

.qui_somme_nous article a {
  text-decoration: underline;
  color: #4daae0;
}

.faq_theme{
  font-family: 'Roboto', 'Arial', 'sans-serif';
  font-size: 15px;
  line-height: 23px;
  color: #595858;
  font-weight: 400;
}

/**** MEDIA QUERIES ****/
@media screen and (max-width: 768px) {
    .produit #sidebar {
        margin-top:40px;
    }

    .gamme .sidebar {
        margin-bottom: 30px;
    }

    header .order-nav p.profil-icon {
        text-align: center;
    }

    header .order-nav p.logo a img {
        margin:0 auto;
    }

    .produit #sidebar .sidebar-content p.conseil {
        margin-bottom:20px;
    }

    .top-info p.text-left {
        text-align: center;
    }

    .espace-client .tab-menu li {
        display: block;
    }

    .espace-client .tab-menu li:first-child {
        border-radius: 0;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
    }

    .espace-client .tab-menu li:last-child {
        border-radius: 0;
        -moz-border-radius: 0;
        -webkit-border-radius: 0;
    }

    #slider, #breadcrumb {
        display:none;
    }

    .partenaires {
        padding-top:30px;
    }

    .partenaires a img {
        margin-bottom:20px;
    }

    header .header-slogan h1, header .header-slogan p {
        font-size: 28px;
        line-height: 30px;
    }

    header .header-slogan .slogan-container {
        top:30%;
    }

    header.header-product .header-slogan .slogan-container {
        top:34%;
    }

    ul.step li {
        width: 100%;
        border: 1px solid #dadada;
    }

    ul.step li.step_current a {
        padding-left: 18px;
    }

    ul.step li.step_todo a:after {
        background: none;
    }

    ul.step li.step_current a:after {
        background: none;
    }
}


@media screen and (max-width: 992px) {
    ul.step li.step_current,
    ul.step li.step_todo,
    ul.step li#step_end {
        min-height:75px;
    }
}


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

}


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

}


@media (min-width: 992px) and (max-width: 1240px) {

}


@media (min-width: 768px) and (max-width: 1240px) {
    ul.step li.step_current,
    ul.step li.step_todo,
    ul.step li#step_end {
        min-height:75px;
    }
}


@media screen and (min-width: 1240px) {

}
