/*
Theme Name: TopHebergement
Theme URI: #
Author: the TopHebergement team
Author URI: TopHebergement
Description: Our 2017 default theme is clean, blog-focused, and designed for clarity. Twenty Fifteen's simple, straightforward typography is readable on a wide variety of screen sizes, and suitable for multiple languages. We designed it using a mobile-first approach, meaning your content takes center-stage, regardless of whether your visitors arrive by smartphone, tablet, laptop, or desktop computer.
Version: 1.8
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, two-columns, left-sidebar, accessibility-ready, custom-background, custom-colors, custom-header, custom-logo, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: twentyfifteen

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/



/*
Table Of Contents

1.)  Typography
2.)  Container - Main
3.)  Header - Main
4.)  Content - Main
5.)  Footer - Main
6.)  Home_all_features - Page
7.)  Blog - Page
8.)  Blog - Article
9.)  Customer Reviews - Page
10.) Hosting - Page
11.) Domain_name - Page

===============================================*/

/*
 1.) Typography
----------------------------------------*/

/*@font-face {
    font-family: 'Lobstertwo';
    src: local('Lobstertwo');
    src: url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/lobstertwo-italic-webfont.eot);
    src: url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/lobstertwo-italic-webfont.eot?#iefix) format('embedded-opentype'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/lobstertwo-italic-webfont.woff2) format('woff2'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/lobstertwo-italic-webfont.woff) format('woff'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/lobstertwo-italic-webfont.ttf) format('truetype'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/lobstertwo-italic-webfont.svg#Lobstertwo) format('svg');
    font-weight: 400;
    font-style: italic;
    font-display: auto;
}

@font-face {
    font-family: 'Oxygen';
    src: local('Oxygen');
    src: url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-light-webfont.woff2) format('woff2'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-light-webfont.woff) format('woff'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-light-webfont.ttf) format('truetype'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-light-webfont.eot) format('embedded-opentype'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-light-webfont.eot?#iefix) format('embedded-opentype'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-light-webfont.svg#Oxygen) format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: auto;
}

@font-face {
    font-family: 'Oxygen';
    src: url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-regular-webfont.eot);
    src: url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-regular-webfont.eot?#iefix) format('embedded-opentype'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-regular-webfont.woff2) format('woff2'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-regular-webfont.woff) format('woff'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-regular-webfont.ttf) format('truetype'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-regular-webfont.svg#Oxygen) format('svg');
    font-weight: 400;
    font-style: normal;
    font-display: auto;
}

@font-face {
    font-family: 'Oxygen';
    src: url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-bold-webfont.eot);
    src: url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-bold-webfont.eot?#iefix) format('embedded-opentype'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-bold-webfont.woff2) format('woff2'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-bold-webfont.woff) format('woff'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-bold-webfont.ttf) format('truetype'),
         url(https://www.tophebergement.com/wp-content/themes/1hebergement/fonts/oxygen-bold-webfont.svg#Oxygen) format('svg');
    font-weight: 700;
    font-style: normal;
    font-display: auto;
}*/


/* #Basic Styles
================================================== */

body {
	-webkit-font-smoothing: antialiased;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
	font-family: "Oxygen", sans-serif;
	font-weight: 400;
	font-size: 19px;
	color: #505c6f;
	line-height: 28px;
	background: #ffffff;
	padding: 0;
	margin: 0;
}


/* #Links
================================================== */

a {
	color: #01cc60;
	text-decoration: none;
	outline: 0;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	cursor: pointer;
	outline: 0;
}

a:hover,
a:focus,
a:active {
	color: #00ae4c;
	text-decoration: underline;
	outline: 0;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}

a:visited {
	outline: 0;
	text-decoration: none;
}


/* #Heading H1, H2, H3, H4, H5, H6, P
================================================== */

h1,
h2,
h3,
h4 { 
	font-weight: 700;
	color: #17191c;
	padding: 0 0 20px 0;/*0 0 24px 0*/
	margin: 0;
}

h1  {
	font-size: 60px;
	line-height: 72px;
}

h2  {
	font-size: 35px;
	line-height: 45px;/*40*/
}

h3 {
	font-size: 26px;
	line-height: 32px;
}

h4 {
	font-size: 20px;
	line-height: 30px;
}

p {
	padding: 0 0 17px 0;
	margin: 0;
}

p:last-child {
	padding: 0 0 73px 0;
}

strong {
	font-weight: 700; 
}

.bold {
	font-weight: 700; 
}

@media (max-width: 767px) {
h1,
h2,
h3,
h4 { 
	padding: 0 0 22px 0;
}

h1  {
	font-size: 40px;
	line-height: 46px;
}

h2 {
	font-size: 30px;
	line-height: 36px;
}

p:last-child {
	padding: 0 0 37px 0;
}
}


/* #Order and Unorder Styles
================================================= */

ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

ul:last-child {
	padding-bottom: 30px;
}

li {
	position: relative;
	padding: 0 0 17px 38px;
	margin: 0;
}

ul:last-child li:last-child {
	padding-bottom: 0;
}

ul li::before {
	content: "";
	width: 21px;
	height: 21px;
	float: left;
	background: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/check.svg) no-repeat left center; 
	background-size: 21px auto;
	position: absolute;
	top: 5px;
	left: 0;
}

li ul:last-child {
	padding-bottom: 0;
}

li ul li:last-child,
li ul li:last-child {
	padding-bottom: 0;
}


/* #Input
================================================== */

input,
input[type="text"],
input[type="email"],
input[type="url"],
input[type="color"] {
	border-radius: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	outline: 0;
}


input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="color"]:focus {
	outline: 0;
}

input {
	-webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
	-moz-transition: border linear 0.2s, box-shadow linear 0.2s;
	-ms-transition: border linear 0.2s, box-shadow linear 0.2s;
	-o-transition: border linear 0.2s, box-shadow linear 0.2s;
	transition: border linear 0.2s, box-shadow linear 0.2s;
}

label {
	width: 100%;
	float: left;
	font-weight: 700;
	font-size: 16px;
	color: #17191c;
	line-height: 20px;
	text-transform: none;
	padding: 0 0 10px 0;
	margin: 0;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="color"],
select {
	width: 100%;
	height: 57px;
	float: left; 
	font-weight: 400; 
	font-size: 18px;
	color: #17191c;
	line-height: 24px;
	background: none;
	border: 1px solid rgba(61, 70, 84, 0.30);
	box-shadow: none;
	border-radius: 5px;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	position: relative;
	padding: 15px 20px;
	margin: 0;
}

::-webkit-input-placeholder, 
::-webkit-textarea-placeholder {
	color: #505c6f;
}

input::-moz-placeholder {
	color: #505c6f;
}

::-moz-placeholder,
::-ms-input-placeholder {
	color: #505c6f;
}

select:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="color"]:focus {
	outline: 0;
	border-color: #01cc60;
}


/* #Buttons
================================================== */

.btn,
button,
input[type="button"] {
	width: auto;
	height: auto;
	float: none;
	display: inline-block;
	vertical-align: middle;
	font-weight: 700;
	font-size: 20px;
	color: #ffffff;
	line-height: 26px;
	letter-spacing: 0.015em;
	text-align: center;
	text-decoration: none;
	text-transform: none;
	white-space: normal;
	background: #3d4654; 
	border: none;
	border-radius: 5px;
	box-shadow: none;
	position: relative;
	cursor: pointer;
	outline: 0;
	overflow: hidden;
	z-index: 1000;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	padding: 16px 30px 13px 30px;
	margin: 0;
}

.btn:hover,
.btn:focus,
.btn:active,
.btn:active:focus,
.btn.active,
.btn.active:focus,
button:hover,
button:focus,
button:active,
button:active:focus,
button.active,
button.active:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="button"]:active,
input[type="button"]:active:focus,
input[type="button"].active,
input[type="button"].active:focus,
.btn:not(:disabled):not(.disabled).active,
.btn:not(:disabled):not(.disabled):active {
	color: #ffffff;
	background: #000000; 
}

.btn-blank,
button.btn-blank,
input.btn-blank[type="button"] {
	color: #3d4654;
	box-shadow: inset #3d4654 0 0 0 1px;
	background: #ffffff;
}

.btn-blank:hover,
.btn-blank:focus,
.btn-blank:active,
.btn-blank:active:focus,
.btn-blank.active,
.btn-blank.active:focus,
button.btn-blank:hover,
button.btn-blank:focus,
button.btn-blank:active,
button.btn-blank:active:focus,
button.btn-blank.active,
button.btn-blank.active:focus,
input.btn-blank[type="button"]:hover,
input.btn-blank[type="button"]:focus,
input.btn-blank[type="button"]:active,
input.btn-blank[type="button"]:active:focus,
input.btn-blank[type="button"].active,
input.btn-blank[type="button"].active:focus {
	color: #ffffff;
	box-shadow: inset #3d4654 0 0 0 1px;
	background: #3d4654;
}

.btn-green,
button.btn-green,
input.btn-green[type="button"] { 
	color: #ffffff;
	background: #00cc5f;
}

.btn-green:hover,
.btn-green:focus,
.btn-green:active,
.btn-green:active:focus,
.btn-green.active,
.btn-green.active:focus,
button.btn-green:hover,
button.btn-green:focus,
button.btn-green:active,
button.btn-green:active:focus,
button.btn-green.active,
button.btn-green.active:focus,
input.btn-green[type="button"]:hover,
input.btn-green[type="button"]:focus,
input.btn-green[type="button"]:active,
input.btn-green[type="button"]:active:focus,
input.btn-green[type="button"].active,
input.btn-green[type="button"].active:focus {
	color: #ffffff;
	background: #00ae4c;
}



/*** btn green with icone ***/

/*.banner-main .bottom-btn .btn-green-icon:before {
    top: 19px;
}*/

/***** FIN BTN GREEN WITH ICONE *****/

.btn-out {
	width: 100%;
	float: left;
}

figure { 
	padding: 0;
	margin: 0;
}



/* #Owl-carousel
=======================================================*/
 @-webkit-keyframes 
fadeOut {
 0% {
 opacity: 1;
}
 100% {
 opacity: 0;
}
}
@keyframes 
fadeOut {
 0% {
 opacity: 1;
}
 100% {
 opacity: 0;
}
}

/* #Slider Controls
================================================== */

/* Previous and Next */


/* Bullets */


/* Table */


/* Figure */
figure { 
	padding: 0;
	margin: 0;
}


/* 
 2.) Container - Main
----------------------------------------*/


.container-main {
	width: 100%;
	float: left;
	overflow: hidden;
}

.container {
	width: 100%;
	max-width: 1710px;
	padding: 0 60px;
}

@media (max-width: 767px) {
.container {
	width: 100%;
	max-width: 530px;
	padding: 0 15px;
}
}


/* Vertical Align - Middle */


/* Check - Options */


/* ToolTip */
button[data-toggle="tooltip"] {
	width: auto;
	color: #505c6f;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	padding: 0;
	margin: 0 0 0 5px;
}

@media (max-width: 767px) {
button[data-toggle="tooltip"] {
	margin: 0 0 0 10px;
}
}

/* Top */


/* Bottom */


/* Left */


/* Right */


/* Ratings */
.ratings-out {
	width: 92px;
	height: 16px;
	float: none;
	display: inline-block;
	vertical-align: middle;
	background: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/stars-empty.png) no-repeat;
	background-size: auto 100%;
	position: relative;
	z-index: 1;
}

.ratings-out .ratings {
	width: 100%;
	height: 100%;
	float: none;
	display: inline-block;
	vertical-align: middle;
	background: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/stars.png) no-repeat;
	background-size: auto 100%;
	position: absolute;
	top: 0;
	left: 0;
}


/* Heading - Txt */


/*
 3.) Header - Main
----------------------------------------*/

.header-main {
	width: 100%;
	height: 115px; /*145*/
	float: left;
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	transition: all .25s ease-out;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10000;
}

.header-main:before {
	content: "";
	width: 100%;
	height: 45px;
	float: left;
	background: #000000;
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	transition: all .25s ease-out;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	opacity: 0.25;
}

.header-main .brand {
	width: 263px;
	height: 100px;
	float: left;
	line-height: 100px;
	position: relative;
	z-index: 50;
	margin: 30px -300px 0 0; /*45 -300 0 0*/
}

.header-main .brand img {
	width: 100%;
	vertical-align: middle;
}

.header-main .brand .scr-vis {
	display: none;
}

.header-main.fixed {
	background: #ffffff;
	box-shadow: rgba(0, 0, 0, .20) 0 0 15px;
	position: fixed;
	top: -45px;
        height: 110px;
}

.header-main.fixed .brand{
    margin: 27px -300px 0 0; /*45 -300 0 0*/
}

.header-main.fixed .brand .nrm-vis {
	display: none;
}

.header-main.fixed .brand .scr-vis {
	display: inline-block;
}

.header-main.fixed .brand .scr-vis img{
	width: 80%;
}

@media (max-width: 767px) {
.header-main, .header-main.fixed {
	height: 65px;/*100px*/
}

.header-main:before {
	display: none;
}

.header-main .container {
	max-width: 100%;
}

.header-main .brand {
	width: 200px;
	margin-top: 0;
        height: 65px;
        line-height: 65px;
}


.header-main.fixed .brand{
    margin-top: 0;
}

.header-main.fixed {
	top: 0;
}
}

@media (min-width: 1024px) {
/* Nav - Bar */
.header-main .nav-bar {
	width: 100%;
	float: left;
	position: relative;
	z-index: 40;
	padding: 27px 0 0 0; /*45 0 0 0*/
}

.header-main .nav-bar .responsive-collapse {
	float: right;
	display: block!important;
}

.header-main .nav-bar .responsive-in {
	float: right;
}

.header-main .nav-bar .main-nav {
	float: left;
}

.header-main .nav-bar .main-nav ul {
	float: left;
	padding: 0;
	margin: 0;
}

.header-main .nav-bar .main-nav ul li {
	float: left;
	padding: 0;
	margin: 0 0 0 52px;
}

.header-main .nav-bar .main-nav ul li:before {
	display: none;
}

.header-main .nav-bar .main-nav ul li > a {
	height: 100px;
	float: left;
	/*font-weight: 700;*/
	font-size: 18px;
	color: #dfdfdf;
	line-height: 100px;
	text-decoration: none;
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	-o-transition: all .25s ease-out;
	transition: all .25s ease-out;
	position: relative;
}

.header-main .nav-bar .main-nav ul li > a:before {
	content: "";
	width: 0;
	height: 3px;
	float: left;
	background: #00cc5f;
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	-o-transition: all .25s ease-out;
	transition: all .25s ease-out;
	position: absolute;
	bottom: 30px; /*21*/
	left: 50%;
	margin: 0;
	opacity: 0;
}

.header-main .nav-bar .main-nav ul li:hover > a {
	color: #ffffff;
}

.header-main .nav-bar .main-nav ul li:hover > a:before {
	width: 100%;
	left: 0;
	opacity: 1;
}

.header-main .nav-bar .btn-scr {
	float: right;
	display: none;
	margin: 26px 0 0 -200px;
}

.header-main .nav-bar .btn-scr a {
	height: 48px;
	float: none;
	display: inline-block;
	vertical-align: middle;
	font-weight: 700;
	font-size: 16px;
	color: #00cc5f;
	line-height: 46px;
	text-decoration: none;
	background: #ffffff;
	border: 1px solid #00cc5f;
	border-radius: 5px;
	padding: 0 20px;
}

.header-main .nav-bar .btn-scr a:hover,
.header-main .nav-bar .btn-scr a:active,
.header-main .nav-bar .btn-scr a.active,
.header-main .nav-bar .btn-scr a:focus {
	color: #ffffff;
	background: #00cc5f;
}

.header-main .nav-bar .top-bar-right {
	width: 100%;
	height: 45px;
	float: right;
	line-height: 45px;
	position: absolute;
	top: 0;
	right: 0;
}

.header-main .nav-bar .top-bar-right .ratings-cont {
	width: 100%;
	float: left;
	font-size: 14px;
	color: #ffffff;
	line-height: 45px;
	text-align: center;
	position: absolute;
	top: 0;
	left: 0;
}

.header-main .nav-bar .top-bar-right .ratings-cont .sp {
	border-bottom: 1px solid #fff;
}

.header-main .nav-bar .top-bar-right .ratings-cont .ratings-out {
	position: relative;
	top: -2px;
	margin: 0 8px;
}

.header-main .nav-bar .top-bar-right .t-links {
	float: right;
}

.header-main .nav-bar .top-bar-right .t-links ul {
	float: left;
	padding: 0;
	margin: 0;
}

.header-main .nav-bar .top-bar-right .t-links ul li {
	float: left;
	padding: 0;
	margin: 0 0 0 20px; /*50*/
}

.header-main .nav-bar .top-bar-right .t-links ul li:before {
	display: none;
}

.header-main .nav-bar .top-bar-right .t-links ul li a {
	height: 45px;
	float: left;
	font-size: 14px;
	color: #ffffff;
	line-height: 45px;
	text-decoration: none;
	background-position: left;
	background-repeat: no-repeat;
}

.header-main .nav-bar .top-bar-right .t-links ul li.phone a,
.header-main .nav-bar .top-bar-right .t-links ul li.contact a,
.header-main .nav-bar .top-bar-right .t-links ul li.client a,
.header-main .nav-bar .top-bar-right .t-links ul li.societe a {
	padding: 0 0 0 24px;
}

.header-main .nav-bar .top-bar-right .t-links ul li.phone a {
	background-image: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/phone.svg);
	background-size: auto 16px;
}

.header-main .nav-bar .top-bar-right .t-links ul li.contact a {
	background-image: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/speech-bubble.svg);
	background-size: auto 16px;
}

.header-main .nav-bar .top-bar-right .t-links ul li.client a {
	background-image: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/profile.svg);
	background-size: auto 16px;
}

.header-main .nav-bar .top-bar-right .t-links ul li.societe a {
	background-image: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/a_propos.svg);
	background-size: auto 16px;
}

.header-main .nav-bar .top-bar-right .t-links ul li a:hover,
.header-main .nav-bar .top-bar-right .t-links ul li a.active {
	text-decoration: underline;
	opacity: .70;
}

.header-main .nav-bar .top-bar-left {
	height: 45px;
	float: left;
	font-size: 14px;
	color: #ffffff;
	line-height: 45px;
	position: absolute;
	top: 0;
	left: 0;
}

.header-main .nav-bar .top-bar-left img {
	display: inline-block;
	position: relative;
    top: -1px;
	width: 20px;
	height: 12px;
	margin: 0 10px 0 5px;
}

.header-main .nav-bar .top-bar-left button {
	font-size: 16px;
	color: rgba(255, 255, 255, .80);
	background: none;
	outline: 0;
	padding: 0 0 0 5px;
	margin: 0 5px 0 0;
}

/* Fixed */

.header-main.fixed .nav-bar .responsive-collapse {
	width: 100%;
}

.header-main.fixed .nav-bar .responsive-in {
	width: 100%;
}

.header-main.fixed .nav-bar .main-nav {
	width: 100%;
	text-align: center;
	padding: 0 145px 0 242px;
}

.header-main.fixed .nav-bar .main-nav ul {
	float: none;
	display: inline-block;
	vertical-align: top;
}

.header-main.fixed .nav-bar .main-nav ul li {
	float: none;
	display: inline-block;
	vertical-align: top;
	margin: 0 17px;
}

.header-main.fixed .nav-bar .main-nav ul li > a {
	font-size: 16px;
	color: #17191c;
}

.header-main.fixed .nav-bar .main-nav ul li:hover > a {
	color: #00cc5f;
}

.header-main.fixed .nav-bar .btn-scr {
	display: block;
}
}

@media (min-width: 1200px) and (max-width: 1399px) {
.header-main .nav-bar .main-nav ul li {
	margin: 0 0 0 40px;
}

.header-main.fixed .nav-bar .main-nav ul li {
	margin: 0 10px;
}
}

@media (min-width: 1200px) and (max-width: 1299px) {
.header-main .nav-bar .main-nav ul li {
	margin: 0 0 0 30px;
}

.header-main .nav-bar .main-nav ul li a {
	font-size: 16px;
}

.header-main .nav-bar .btn-scr a {
	font-size: 15px;
	padding: 0 15px;
}

.header-main .nav-bar .top-bar-right .t-links ul li {
	margin: 0 0 0 35px;
}

.header-main .nav-bar .top-bar-right .t-links ul li.client {
	display: none;
}

.header-main.fixed .nav-bar .main-nav {
	padding: 0 145px 0 260px;
}

.header-main.fixed .nav-bar .main-nav ul li {
	margin: 0 8px;
}

.header-main.fixed .nav-bar .main-nav ul li a {
	font-size: 15px;
}
}

@media (min-width: 1200px) and (max-width: 1239px) {
.header-main .nav-bar .main-nav ul li {
	margin: 0 0 0 30px;
}

.header-main .nav-bar .main-nav ul li a {
	font-size: 16px;
}

.header-main .nav-bar .btn-scr a {
	font-size: 16px;
	padding: 0 20px;
}

.header-main .nav-bar .top-bar-right .t-links ul li {
	margin: 0 0 0 30px;
}

.header-main.fixed .nav-bar .main-nav {
	width: auto;
	float: right;
	padding: 0;
}

.header-main.fixed .nav-bar .main-nav ul li {
	float: left;
}

.header-main.fixed .nav-bar .main-nav ul li {
	float: left;
	margin: 0 0 0 30px;
}

.header-main.fixed .nav-bar .main-nav ul li a {
	font-size: 16px;
}

.header-main.fixed .nav-bar .btn-scr {
	display: none;
}
}

@media (max-width: 1023px) {

.header-main .nav-bar .responsive-collapse {
	width: 100%;
	height: 100%;
	float: left;
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	-o-transition: all .25s ease-out;
	transition: all .25s ease-out;
	visibility: hidden;
	opacity: 0;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 5;
	padding: 125px 0 0 0; /*145 0 0 0*/
}

.header-main .nav-bar .responsive-collapse.active {
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	-o-transition: all .25s ease-out;
	transition: all .25s ease-out;
	visibility: visible;
	opacity: 1;
}

.header-main .nav-bar .responsive-in {
	width: 100%;
	height: 100%;
	float: left;
	background: rgba(0, 0, 0, .70);
	border-top: 2px solid #f3f3f3;
	overflow: auto;
	overflow-x: hidden;
}

.header-main .nav-bar .main-nav {
	width: 100%;
	float: left;
	background: #ffffff;
	padding: 11px 60px;
	margin-top: -2px;
}

.header-main .nav-bar .main-nav ul {
	width: 100%;
	float: left;
	padding: 0;
	margin: 0;
}

.header-main .nav-bar .main-nav ul li {
	width: 100%;
	float: left;
	border-bottom: 1px solid #d1d1d2;
	padding: 0;
	margin: 0;
}

.header-main .nav-bar .main-nav ul li:last-child {
	border-bottom: none;
}

.header-main .nav-bar .main-nav ul li:before {
	display: none;
}

.header-main .nav-bar .main-nav ul li > a {
	width: 100%;
	float: left;
	font-weight: 400;
	font-size: 18px;
	color: #17191c;
	line-height: 22px;

	text-decoration: none;
	background: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/chevron-right.svg) no-repeat right center;
	background-size: 12px auto;
	-webkit-transition: all .25s ease-out;
	-moz-transition: all .25s ease-out;
	-o-transition: all .25s ease-out;
	transition: all .25s ease-out;
	position: relative;
	padding: 13px 50px 14px 0;
}

.header-main .nav-bar .main-nav ul li:hover > a {
	color: #00cc5f;
}

.header-main .nav-bar .btn-scr {
	display: none;
}

.header-main .nav-bar .top-bar-right {
	width: 100%;
	float: left;
	background: #f3f3f3;
	padding: 25px 60px;
}

.header-main .nav-bar .top-bar-right .ratings-cont {
	width: 100%;
	float: left;
	font-size: 18px;
	color: #17191c;
	line-height: 26px;
	margin-bottom: 11px;
}

.header-main .nav-bar .top-bar-right .ratings-cont .sp {
	display: none;
}

.header-main .nav-bar .top-bar-right .ratings-cont .ratings-out {
	position: relative;
	top: -2px;
	margin: 0 8px;
}

.header-main .nav-bar .top-bar-right .ratings-cont .ratings-out {
	width: 104px;
	height: 18px;
}

.header-main .nav-bar .top-bar-right .t-links {
	width: 100%;
	float: left;
}

.header-main .nav-bar .top-bar-right .t-links ul {
	width: 100%;
	float: left;
	padding: 0;
	margin: 0;
}

.header-main .nav-bar .top-bar-right .t-links ul li {
	width: 100%;
	float: left;
	padding: 5px 0;
	margin: 0;
}

.header-main .nav-bar .top-bar-right .t-links ul li:before {
	display: none;
}

.header-main .nav-bar .top-bar-right .t-links ul li a {
	width: 100%;
	float: left;
	font-size: 18px;
	color: #17191c;
	line-height: 26px;
	text-decoration: none;
	background-position: left;
	background-repeat: no-repeat;
	padding: 5px 0;
}

.header-main .nav-bar .top-bar-right .t-links ul li.phone a,
.header-main .nav-bar .top-bar-right .t-links ul li.contact a,
.header-main .nav-bar .top-bar-right .t-links ul li.client a,
.header-main .nav-bar .top-bar-right .t-links ul li.societe a {
	padding-left: 24px;
}

.header-main .nav-bar .top-bar-right .t-links ul li.phone a {
	background-image: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/phone-black.svg);
	background-size: auto 16px;
}

.header-main .nav-bar .top-bar-right .t-links ul li.contact a {
	background-image: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/speech-bubble-black.svg);
	background-size: auto 16px;
}

.header-main .nav-bar .top-bar-right .t-links ul li.client a {
	background-image: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/profile-black.svg);
	background-size: auto 16px;
}

.header-main .nav-bar .top-bar-right .t-links ul li.societe a {
	background-image: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/a_propos-black.svg);
	background-size: auto 16px;
}

.header-main .nav-bar .top-bar-right .t-links ul li a:hover,
.header-main .nav-bar .top-bar-right .t-links ul li a.active {
	text-decoration: underline;
	opacity: .70;
}

.header-main .nav-bar .top-bar-left {
	height: 45px;
	float: left;
	font-size: 14px;
	color: #ffffff;
	line-height: 45px;
	position: absolute;
	top: 0;
	left: 60px;
}

.header-main .nav-bar .top-bar-left img {
	display: inline-block;
	position: relative;
    top: -1px;
	width: 20px;
	height: 12px;
	margin: 0 10px 0 5px;
}

.header-main .nav-bar .top-bar-left button {
	font-size: 16px;
	color: #808080;
	background: none;
	outline: 0;
	padding: 0 0 0 5px;
	margin: 0 5px 0 0;
}

/* Fixed */
.header-main.fixed .nav-bar .responsive-collapse {
	padding-top: 65px; /*100px*/
}
}

@media (max-width: 767px) {
.header-main .nav-bar {
	padding: 0;
}

.header-main .nav-bar .responsive-collapse {
	padding-top: 64px !important;/*100px*/
}

.header-main .nav-bar .main-nav {
	padding: 11px 15px;
}

.header-main .nav-bar .top-bar-right {
	padding: 25px 15px;
}

.header-main .nav-bar .top-bar-left {
	display: none;
}
}


/* Menu - Btn */
.header-main .menu-btn {
	width: 37px;
	height: 30px;
	float: left;
	display: none;
	cursor: pointer;
	z-index: 10001;
	position: absolute;
	top: 65px; /*81*/
	right: 60px;
}

.header-main .menu-btn .icon-bar {
	width: 100%;
	height: 4px;
	float: left;
	background: #ffffff;
	position: relative;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
	margin: 12px 0 0 0;
}

.header-main .menu-btn .icon-bar:before {
	content: "";
	width: 100%;
	height: 4px;
	float: left;
	background: #ffffff;
	position: absolute;
	top: -12px;
	left: 0;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.header-main .menu-btn .icon-bar:after {
	content: "";
	width: 100%;
	height: 4px;
	float: left;
	background: #ffffff;
	position: absolute;
	top: 12px;
	left: 0;
	-webkit-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.header-main .menu-btn.active .icon-bar {
	background: none;
}

.header-main .menu-btn.active .icon-bar:before {
	top: 0;
	-webkit-transform: rotate3d(0, 0, 1, 45deg);
	transform: rotate3d(0, 0, 1, 45deg);
}

.header-main .menu-btn.active .icon-bar:after {
	top: 0;
	-webkit-transform: rotate3d(0, 0, 1, -45deg);
	transform: rotate3d(0, 0, 1, -45deg);
}

.header-main.fixed .menu-btn .icon-bar,
.header-main.fixed .menu-btn .icon-bar:before,
.header-main.fixed .menu-btn .icon-bar:after {
	background: #262c3b;
}

.header-main.fixed .menu-btn.active .icon-bar {
	background: none;
}

@media (max-width: 1023px) {
    .header-main .menu-btn {
            display: block;
    }
}

@media (max-width: 767px) {
.header-main .menu-btn {
	top: 22px;
	right: 15px;
}
}


/* 
 4.) Content - Main
----------------------------------------*/

.content-main {
	width: 100%;
	float: left;
	background: #ffffff;
	position: relative;
	overflow: hidden;
}


/* Bottom Sticky - Bar */


/* Nodification - Box */


/* Banner - Main */

/*13.09.2021*/
@media (max-width: 1599px) AND (min-width: 1300px) {
	/*.banner-main .prize-cont .prize sub { margin: 0px 0 0 -40px !important; }*/
}
/*@media (min-width: 992px) and (max-width: 1199px) {
	.banner-main .prize-cont { left: 58% !important; bottom: 0; margin-right: -20%; }
	.banner-main .prize-cont .prize-out {
		width: auto;
		float: none;
		display: inline-block;
		vertical-align: bottom;
		position: relative;
		margin: 0 -50px 0 0;
	}
	.banner-main .prize-cont .prize {
		font-size: 120px;
		line-height: 1em;
		text-shadow: 6px 3px 0 rgb(0 34 183 / 38%);
		margin: 0 10px 0 0;
	}
	.banner-main .prize-cont .prize .txt1 {
		display: none;
	}
	.banner-main .prize-cont .prize sup {
		font-size: 60px;
		text-shadow: 4px 2px 0 rgb(0 34 183 / 38%);
		top: 29%;
		right: 4%;
		margin: 0;
	}
	.banner-main .prize-cont .prize sub {
		font-weight: 400;
		font-size: 22px;
		text-shadow: 4px 2px 0 rgb(0 34 183 / 38%);
		margin: -10px 0 0 -23px;
	}
}*/


/* Partners - Logos */


/* Pricing - Tables - Out */


/* Tab - Links */


/* Tab - Content */

/* Pricing - Tables */
/*
@media (max-width: 1199px) {
.pricing-tables .heading-txt {
	padding: 0 60px 15px 60px;
}

.pricing-tables .article {
	margin: 60px 0;
}

.pricing-tables .article .box-in {
	opacity: 0.35;
}

.pricing-tables .article ul {
	padding: 0 5% 42px 15%;
}

.pricing-tables .center .article .box-in {
	opacity: 1;
}

.pricing-tables .owl-nav .owl-prev {
	left: 156px;
}

.pricing-tables .owl-nav .owl-next {
	right: 156px;
}
}

@media (max-width: 991px) {
.pricing-tables .article ul {
	padding: 0 30px 42px 30px;
}

.pricing-tables .owl-nav .owl-prev {
	left: 60px;
}

.pricing-tables .owl-nav .owl-next {
	right: 60px;
}
}*/


/* Feature - List */


/* CTA - Content */
.cta-cont {
	width: 100%;
	float: left;
	background: #3d4654;
	padding: 45px 0;
}

.cta-cont aside {
	width: 50%;
	float: none;
	display: inline-block;
	vertical-align: middle;
	padding: 0 15px 0 0;
	margin: 0 -4px 0 0;
}

.cta-cont aside h3 {
	color: #ffffff;
	padding: 0 0 16px 0;
}

.cta-cont aside h3:last-child {
	padding-bottom: 0;
}

.cta-cont aside p {
	color: #ffffff;
	line-height: 26px;
}

.cta-cont aside p:last-child {
	padding-bottom: 0;
}

.cta-cont .btn-out {
	width: 50%;
	float: none;
	display: inline-block;
	vertical-align: middle;
	text-align: right;
	padding: 0 0 0 15px;
	margin: 0 0 0 -4px;
}

@media (max-width: 767px) {
.cta-cont {
	padding: 44px 0 50px 0;
}

.cta-cont aside {
	width: 100%;
	padding: 0 0 24px 0;
	margin: 0;
}

.cta-cont aside:last-child {
	padding-bottom: 0;
}

.cta-cont .btn-out {
	width: 100%;
	text-align: left;
	padding: 0;
	margin: 0;
}
}


/* Satisfied - Content */


/* Award - Info */


/* Quick - Statistics */


/* Testimonials */


/* Social - Links */
.social-links {
	width: 100%;
	float: left;
	text-align: center;
	background: #f6f6f6;
	padding: 50px 0 50px 0;
        border-top: 3px solid #ddd;
}

.social-links ul {
	width: auto;
	float: none;
	display: inline-block;
	vertical-align: middle;
	padding: 0;
	margin: 0 -98px -50px -98px;
}

.social-links ul li {
	width: auto;
	float: none;
	display: inline-block;
	vertical-align: middle;
	padding: 0;
	margin: 0 98px 50px 98px;
}

.social-links ul li:before {
	display: none;
}

.social-links ul li a {
	text-decoration: none;
	opacity: 0.15;
}

.social-links ul li img {
	width: 100%;
	max-width: 49px;
}

.social-links ul li .img2 {
	display: none;
}

.social-links ul li.facebook {
	margin-right: 86px;
	margin-left: 86px;
}

.social-links ul li a:hover {
	opacity: 1;
}

.social-links ul li a:hover .img1 {
	display: none;
}

.social-links ul li a:hover .img2 {
	display: inline-table;
}

@media (max-width: 767px) {
.social-links ul {
	margin: 0 -35px -50px -35px;
}

.social-links ul li {
	margin: 0 32px 50px 32px;
}

.social-links ul li img {
	max-width: 34px;
}

.social-links ul li.facebook {
	margin-right: 27px;
	margin-left: 27px;
}
}

@media (max-width: 359px) {
.social-links ul {
	margin: 0 -20px -50px -20px;
}

.social-links ul li {
	margin: 0 20px 50px 20px;
}

.social-links ul li.facebook {
	margin-right: 17px;
	margin-left: 17px;
}
}


/* 
 5.) Footer - Main
----------------------------------------*/

.footer-main {
	width: 100%;
	float: left;
        max-height: 450px;
}

.footer-main .pre-footer {
	width: 100%;
	float: left;
	padding: 50px 0 42px 0;
}

.footer-main .pre-footer .article {
	width: 14.80%;
	float: left;
	margin: 0 0.94% 0 0.94%;
}

.footer-main .pre-footer .article .foot-logo {
	width: 100%;
	float: left;
	margin: 0 0 24px 0;
}

.footer-main .pre-footer .article .foot-logo img {
	width: 100%;
	max-width: 240px;
}

.footer-main .pre-footer .article h4 {
	font-weight: 700;
	font-size: 16px;
	color: #17191c;
	line-height: 26px;
	text-transform: uppercase;
	padding: 0 0 13px 0;
}

.footer-main .pre-footer .article h4:last-child {
	margin-bottom: 0;
}

.footer-main .pre-footer .article p {
	font-size: 15px;
	color: #505c6f;
	line-height: 26px;
	padding: 0 0 17px 0;
}

.footer-main .pre-footer .article ul {
	width: 100%;
	float: left;
	padding: 0;
	margin: 0;
}

.footer-main .pre-footer .article ul li {
	width: 100%;
	float: left;
	font-size: 14px;
	color: #505c6f;
	line-height: 26px;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	padding: 0;
	margin: 0 0 3px 0;
}

.footer-main .pre-footer .article ul li:last-child {
	margin-bottom: 0;
}

.footer-main .pre-footer .article ul li:before {
	display: none;
}

.footer-main .pre-footer .article ul li a {
	color: #505c6f;
	text-decoration: none;
}

.footer-main .pre-footer .article ul li:hover a,
.footer-main .pre-footer .article ul li.active a {
	color: #32d47e;
}

.footer-main .pre-footer .article.lrg {
	width: 31.40%;
	padding-right: 8.50%
}

.footer-main .pre-footer .article-out {
	width: 101.88%;
	float: left;
	padding: 0;
	margin: 0 -0.94% 0 -0.94%;
}

.footer-main .pre-footer .article .cards {
	width: 120%;
	float: left;
	margin: 0 -20% 43px 0;
}

.footer-main .pre-footer .article .cards:last-child {
	margin-bottom: 0;
}

.footer-main .pre-footer .article .cards ul {
	width: auto;
	float: none;
	display: inline-block;
	vertical-align: middle;
	padding: 0;
	margin: 0 -13px -20px -13px;
}

.footer-main .pre-footer .article .cards ul li:before {
	display: none;
}

.footer-main .pre-footer .article .cards ul li {
	width: auto;
	float: none;
	display: inline-block;
	vertical-align: middle;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	padding: 0;
	margin: 0 13px 20px 13px;
}

.footer-main .pre-footer .article .cards ul li a {
	text-decoration: none;
}

.footer-main .pre-footer .article .cards ul li img {
	max-width: 100%;
        max-height: 31px;/* ADD 04/09/2019 */
}

.footer-main .pre-footer .article .cards ul li .img2 {
	display: none;
}

.footer-main .pre-footer .article .cards ul li a {
	text-decoration: none;
}

.footer-main .pre-footer .article .cards ul li:hover .img1,
.footer-main .pre-footer .article .cards ul li.active .img1 {
	display: none;
}

.footer-main .pre-footer .article .cards ul li:hover .img2,
.footer-main .pre-footer .article .cards ul li.active .img2 {
	display: inline-block;
}

.footer-main .copy-rights {
	width: 100%;
	float: left;
	border-top: 1px solid #e7e8e8;
	padding: 15px 0;
}

.footer-main .copy-rights p {
	width: 50%;
	float: none;
	display: inline-block;
	vertical-align: middle;
	font-size: 14px;
	color: #505c6f;
	line-height: 24px;
	padding: 0;
	margin: 0 -4px 0 0;
}

.footer-main .copy-rights p a {
	color: #505c6f;
	text-decoration: none;
}

.footer-main .copy-rights p a:hover,
.footer-main .copy-rights p a.active {
	color: #32d47e;
}

.footer-main .copy-rights .logos-out {
	width: 50%;
	float: none;
	display: inline-block;
	vertical-align: middle;
	text-align: right;
	margin: 0 0 0 -5px;
}

.footer-main .copy-rights .logos-out ul {
	float: none;
	display: inline-block;
	vertical-align: middle;
	padding: 0;
	margin: 0 -25px -50px -25px;
}

.footer-main .copy-rights .logos-out ul li {
	float: none;
	display: inline-block;
	vertical-align: middle;
	padding: 0;
	margin: 0 25px 50px 25px;
}

.footer-main .copy-rights .logos-out ul li:before {
	display: none;
}

.footer-main .copy-rights .logos-out ul li img {
	max-width: 100%;
        max-height: 25px;/* ADD 04/09/2019 */
}

.footer-main .copy-rights .logos-out ul li a {
	text-decoration: none;
}

@media (max-width: 1599px) {
.footer-main .pre-footer .article {
	width: 15.80%;
}

.footer-main .pre-footer .article.lrg {
	width: 27.40%;
	padding-right: 0
}

.footer-main .pre-footer .article .cards {
	width: 110%;
	margin: 0 -10% 43px 0;
}

.footer-main .pre-footer .article .cards ul {
	margin: 0 -8px -20px -8px;
}

.footer-main .pre-footer .article .cards ul li {
	margin: 0 8px 20px 8px;
}
}

@media (max-width: 1399px) {
.footer-main .pre-footer {
	padding: 50px 0 42px 0;
}

.footer-main .pre-footer .article {
	width: 21.7%; /*30.03*/
	margin: 0 1.65% 36px 1.65%;
}

.footer-main .pre-footer .article .cards {
	width: 100%;
	margin: 0 0 43px 0;
}

.footer-main .pre-footer .article .cards ul {
	margin: 0 -13px -20px -13px;
}

.footer-main .pre-footer .article .cards ul li {
	margin: 0 13px 20px 13px;
}

.footer-main .pre-footer .article.lrg {
	width: 100%; /*63.36*/
	padding-right: 0
}

.footer-main .pre-footer .article-out {
	width: 103.30%;
	margin: 0 -1.65% -36px -1.65%;
}

.footer-main .copy-rights {
	text-align: center;
	padding: 10px 0 15px 0;
}

.footer-main .copy-rights p {
	width: 100%;
	margin: 0 0 5px 0;
}

.footer-main .copy-rights .logos-out {
	width: 100%;
	text-align: center;
	margin: 0;
}
}

@media (max-width: 1199px) {
.footer-main .pre-footer .article {
	width: 21.7%;
	margin: 0 1.65% 45px 1.65%;
}

.footer-main .pre-footer .article.lrg {
	width: 100%;
	padding-right: 0;
}

.footer-main .pre-footer .article-out {
	width: 103.30%;
	margin: 0 -1.65% -45px -1.65%;
}
}

@media (max-width: 991px) {
.footer-main .pre-footer .article {
	width: 46.7%;
	margin: 0 1.65% 45px 1.65%;
}

.footer-main .pre-footer .article.lrg {
	width: 100%;
	padding-right: 0;
}

.footer-main .pre-footer .article-out {
	width: 103.30%;
	margin: 0 -1.65% -45px -1.65%;
}
}

@media (max-width: 767px) {
.footer-main .pre-footer .article {
	width: 45.56%;
	margin: 0 2.22% 36px 2.22%;
}

.footer-main .pre-footer .article ul li.active a {
	color: #32d47e;
}

.footer-main .pre-footer .article .cards {
	width: 100%;
	padding: 25px 0 7px 0;
	margin: 0 0 43px 0;
}

.footer-main .pre-footer .article.lrg {
	width: 95.56%;
}

.footer-main .pre-footer .article-out {
	width: 104.44%;
	margin: 0 -2.22% -36px -2.22%;
}
}

@media (max-width: 479px) {
.footer-main .pre-footer .article {
	width: 100%;
	margin: 0 0 36px 0;
}

.footer-main .pre-footer .article .cards ul {
	margin: 0 -9px -20px -9px;
}

.footer-main .pre-footer .article .cards ul li {
	margin: 0 7px 20px 7px;
}

.footer-main .pre-footer .article.lrg {
	width: 100%;
}

.footer-main .pre-footer .article-out {
	width: 100%;
	margin: 0 0 -36px 0;
}

.footer-main .copy-rights .logos-out ul {
	margin: 0 -10px -20px -10px;
}

.footer-main .copy-rights .logos-out ul li {
	margin: 0 8px 20px 8px;
}
}


/* 
 6.) Home_page_all_features - Page
----------------------------------------*/


/* Table - Content */


/* Table Content - Slider */


/*
 7.) Blog - Page
----------------------------------------*/

/* Banner - Blog */
.banner-blog {
	width: 100%;
	float: left;
	background-repeat: no-repeat;
	background-position: top center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	position: relative;
	padding: 200px 0 75px 0;
}

.banner-blog:before {
	content: "";
	width: 100%;
	height: 100%;
	float: left;
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	top: 0;
	left: 0;
}

.banner-blog .banner-cont {
	width: 100%;
	float: left;
	position: relative;
	/*z-index: 50;*/
}

.banner-blog .banner-cont h1 {
	color: #ffffff;
	padding: 0 0 43px 0;
}

.banner-blog .banner-cont h1:last-child {
	padding-bottom: 0;
}

.banner-blog .banner-cont p {
	color: #ffffff;
}

.banner-blog .banner-cont p:last-child {
	padding-bottom: 0;
}

.banner-blog .banner-cont ul {
	width: 100%;
	float: left;
	padding: 5px 0 0 0;
	margin: 0;
}

.banner-blog .banner-cont ul li {
	width: 100%;
	float: left;
	color: #ffffff;
}

.banner-blog .banner-cont ul li:last-child {
	padding-bottom: 0;
}

.banner-blog .banner-cont aside {
	width: 100%;
	max-width: 1160px;
	float: left;
	padding: 0 240px 0 0;
}

.banner-blog .banner-cont .icon-play {
	width: 200px;
	float: right;
	font-size: 18px;
	color: #ffffff;
	line-height: 26px;
	text-align: center;
	position: relative;
	z-index: 50;
	margin: 0 0 0 -200px;
}

.banner-blog .banner-cont .icon-play .icon {
	width: 100%;
	float: left;
	margin: 0 0 27px 0;
}

.banner-blog .banner-cont .icon-play .icon:last-child {
	margin-bottom: 0;
}

.banner-blog .banner-cont .icon-play .icon img {
	width: 100%;
	max-width: 121px;
}

.banner-blog .banner-cont .icon-play a {
	color: #ffffff;
	text-decoration: none;
}

@media (max-width: 1299px) {
	.banner-blog .banner-cont .icon-play { display: none; }
}

@media (max-width: 1199px) {
.banner-blog .banner-cont {
	max-width: 815px;
}

.banner-blog .banner-cont aside {
	max-width: 100%;
	padding: 0 80px 0 0;
}

.banner-blog .banner-cont .icon-play {
	width: 55px;
	position: absolute;
	top: 12px;
	right: 0;
	margin: 0;
}

.banner-blog .banner-cont .icon-play .icon {
	margin: 0;
}

.banner-blog .banner-cont .icon-play .icon img {
	max-width: 55px;
}

.banner-blog .banner-cont .icon-play span {
	display: none;
}
}

@media (max-width: 767px) {
.banner-blog {
	padding: 115px 0 43px 0;
}

.banner-blog .banner-cont {
	max-width: 100%;
}

.banner-blog .banner-cont h1 {
	text-align: center;
	padding: 0 0 45px 0;
}

.banner-blog .banner-cont aside {
	max-width: 100%;
	padding: 0;
}

.banner-blog .banner-cont .icon-play {
	display: none;
}
}


/* Category - List */
.category-list {
	width: 100%;
	float: left;
	text-align: center;
	padding: 46px 0 47px 0;
}

.category-list .dropdown-toggle {
	width: 100%;
	float: left;
	display: none;
	font-size: 20px;
	color: #505c6f;
	line-height: 26px;
	cursor: pointer;
	padding: 28px 15px 26px 16px;
}

.category-list .dropdown-toggle:after {
	display: none;
}

.category-list .dropdown-toggle:before {
	content: "";
	width: 12px;
	height: 12px;
	float: none;
	display: inline-block;
	vertical-align: middle;
	background: url(https://www.tophebergement.com/wp-content/themes/1hebergement/img/plus.svg) no-repeat center center;
	background-size: 12px auto;
	margin: -3px 12px 0 0;
}

.category-list .dropdown-menu {
	width: 100%;
	float: left;
	text-align: center;
	background: none;
	border: none;
	border-radius: 0;
	padding: 0;
	margin: 0;
}

.category-list .dropdown-menu ul {
	width: auto;
	float: none;
	display: inline-block;
	vertical-align: top;
	overflow: hidden;
	padding: 0;
	margin: 0 -13px -7px -13px;
}

.category-list .dropdown-menu ul li {
	width: auto;
	float: none;
	display: inline-block;
	vertical-align: top;
	font-size: 20px;
	color: #505c6f;
	line-height: 26px;
	padding: 0 12px 0 12px;
	margin: 0 0 7px 0;
}

.category-list .dropdown-menu ul li:before {
	display: none;
}

.category-list .dropdown-menu ul li:after {
	content: "";
	width: 1px;
	height: 20px;
	float: left;
	background: #505c6f;
	position: absolute;
	top: 50%;
	right: -4px;
	margin: -10px 0 0 0;
}

.category-list .dropdown-menu ul li:last-child:after {
	display: none;
}

.category-list .dropdown-menu ul li a {
	float: left;
	color: #505c6f;
	text-decoration: none;
}

.category-list .dropdown-menu ul li:hover a,
.category-list .dropdown-menu ul li.active a {
	color: #00cc5f;
}

.category-list .dropdown-menu ul li.category-name {
	font-weight: 700;
	padding-right: 0
}

.category-list .dropdown-menu ul li.category-name:after {
	display: none;
}

@media (min-width: 768px) {
.category-list .dropdown-menu {
	width: auto;
	float: none;
	display: inline-block!important;
	vertical-align: top;
	position: relative!important;
	top: 0;
	left: 0;
}
}

@media (max-width: 767px) {
.category-list {
	padding: 0;
}

.category-list .container {
	padding: 0;
}

.category-list .dropdown-toggle {
	display: block;
}

.category-list .dropdown-menu {
	width: 100%;
	max-width: 100%!important;
	float: left;
	text-align: center;
	background: none!important;
	border: none!important;
	border-radius: 0;
	box-shadow: none;
	Transform: none!important;
	position: relative!important;
	top: 0!important;
	left: 0!important;
	padding: 0!important;

	margin: 0!important;
}

.category-list .dropdown-menu ul {
	width: 100%;
	padding: 0 0 44px 0;
	margin: 0 0 -13px 0;
}

.category-list .dropdown-menu ul li {
	width: 100%;
	padding: 0;
	margin: 0 0 19px 0;
}

.category-list .dropdown-menu ul li:after {
	display: none;
}

.category-list .dropdown-menu ul li a {
	width: 100%;
	padding: 0 15px 0 15px;
}

.category-list .dropdown-menu ul li.category-name {
	display: none;
}
}


/* Blog - List */
.blog-list {
	width: 100%;
	float: left;
	background: #f6f6f6;
	padding: 65px 0 70px 0;/*92 0 100 0*/
}

.blog-list .container {
	padding: 0;
}

.blog-list h2 {
	width: 100%;
	float: left;
	text-align: center;
	padding: 0 60px 69px 60px;
}

.blog-list .article {
	width: 33.33%;
	float: left;
	padding: 0 15px 30px 15px;
}

.blog-list .article h3 {
	font-size: 20px;
	color: #17191c;
	line-height: 28px;
	padding: 0 0 13px 0;
}

.blog-list .article h3:last-child {
	padding-bottom: 0;
}

.blog-list .article h3 a {
	color: #17191c;
	text-decoration: none;
}

.blog-list .article h3 a:hover {
	color: #00cc5f;
}

.blog-list .article p {
	padding: 0;
}

.blog-list .article .sml-txt {
	width: 100%;
	float: left;
	font-size: 18px;
	color: #505c6f;
	line-height: 26px;
}

.blog-list .article .sml-txt i {
	float: none;
	display: inline-block;
	vertical-align: middle;
	margin: 0 3px 6px 0;
}

.blog-list .article .sml-txt i img {
	width: 100%;
	max-width: 15px;
}

.blog-list .article .sml-txt br {
	display: none;
}

.blog-list .article .sml-txt a {
	color: #505c6f;
	text-decoration: none;
}

.blog-list .article .sml-txt a:hover {
	color: #00cc5f;
}

.blog-list .article figure {
	width: 100%;
	float: left;
	text-align: center;
	overflow: hidden;
}

.blog-list .article figure img {
	width: 100%;
	border-radius: 5px 5px 0 0;
}

.blog-list .article aside {
	width: 100%;
	float: left;
	padding: 25px 30px 112px 30px;
}

.blog-list .article .btn-out {
	text-align: center;
	position: absolute;
	bottom: 30px;
	left: 0;
}

.blog-list .article .box {
	width: 100%;
	float: left;
	background: #ffffff;
	border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.12) 0 7px 20px;
	position: relative;
}

.blog-list .article-out {
	width: 100%;
	float: left;
	padding: 0 45px 100px 45px;
	margin: 0 0 -30px 0;
}

.blog-list .article-out:last-child {
	padding-bottom: 0;
}

@media (max-width: 1199px) {
.blog-list .article {
	width: 50%;
}

.blog-list .article:nth-child(3),
.blog-list .article:nth-child(6),
.blog-list .article:nth-child(9),
.blog-list .article:nth-child(12),
.blog-list .article:nth-child(15),
.blog-list .article:nth-child(18),
.blog-list .article:nth-child(21) {
	display: none;
}
}

@media (max-width: 767px) {
.blog-list {
	padding: 44px 0 50px 0;
}

.blog-list h2 {
	padding: 0 15px 42px 15px;
}

.blog-list .article {
	width: 100%;
	padding: 0 0 30px 0;
}

.blog-list .article h3 {
	padding: 0 0 7px 0;
}

.blog-list .article .sml-txt {
	text-align: center;
	line-height: 35px;
}

.blog-list .article .sml-txt i {
	font-size: 15px;
}

.blog-list .article .sml-txt br {
	display: block;
}

.blog-list .article aside {
	padding: 25px 30px 109px 30px;
}

.blog-list .article-out {
	padding: 0 15px 50px 15px;
	margin: 0 0 -30px 0;
}

.blog-list .article-out:last-child {
	padding-bottom: 0;
}
}


/* Pagination */


/* Add - Info */
.add-info {
	width: 100%;
	float: left;
	text-align: center;
	padding: 50px 0;
}

.add-info figure {
	width: 100%;
	float: left;
	text-align: center;
	overflow: hidden;
}

.add-info figure img {
	width: 100%;
	max-width: 728px;
}

.add-info figure .img2 {
	display: none;
}

@media (max-width: 767px) {
.add-info figure img {
	max-width: 200px;
}

.add-info figure .img1 {
	display: none;
}

.add-info figure .img2 {
	display: inline-block;
}
}


/* Blog - List */
.blog-list2 {
	width: 100%;
	float: left;
	text-align: center;
	background: #f6f6f6;
	padding: 65px 0 70px 0;/*92 0 100 0*/
}

.blog-list2 .container {
	padding: 0;
}

.blog-list2 h2 {
	width: 100%;
	float: left;
	text-align: center;
	padding: 0 60px 79px 60px;
}

.blog-list2 .article {
	width: 16.66%;
	float: left;
	padding: 0 15px 30px 15px;
}

.blog-list2 .article h3 {
	font-size: 20px;
	color: #17191c;
	line-height: 26px;
	padding: 0 0 7px 0;
}

.blog-list2 .article h3:last-child {
	padding-bottom: 0;
}

.blog-list2 .article h3 a {
	color: #17191c;
	text-decoration: none;
}

.blog-list2 .article h3 a:hover {
	color: #00cc5f;
}

.blog-list2 .article p {
	line-height: 30px;
	padding: 0;
}

.blog-list2 .article figure {
	width: 100%;
	float: left;
	text-align: center;
	overflow: hidden;
}

.blog-list2 .article figure img {
	width: 100%;
	border-radius: 5px 5px 0 0;
}

.blog-list2 .article aside {
	width: 100%;
	float: left;
	padding: 28px 15px 112px 15px;
}

.blog-list2 .article .btn-out {
	text-align: center;
	position: absolute;
	bottom: 30px;
	left: 0;
}

.blog-list2 .article .box {
	width: 100%;
	float: left;
	background: #ffffff;
	border-radius: 5px;
	box-shadow: rgba(0, 0, 0, 0.12) 0 7px 20px;
	position: relative;
}

.blog-list2 .article-out {
	width: 100%;
	float: left;
	padding: 0 45px 0 45px;
	margin: 0 0 -30px 0;
}

@media (max-width: 1599px) {
.blog-list2 .article {
	width: 33.33%;
}
}

@media (max-width: 1199px) {
.blog-list2 .article {
	width: 100%;
	padding: 0 0 30px 0;
}

.blog-list2 .article figure {
	width: 200px;
	float: none;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	z-index: 50;
	margin: 0 -200px 0 -1px;
}

.blog-list2 .article figure img {
	width: 100%;
	border-radius: 5px 0 0 5px;
}

.blog-list2 .article aside {
	width: 100%;
	float: none;
	display: inline-block;
	vertical-align: middle;
	padding: 0 310px 0 230px;
	margin: 0 0 0 -6px;
}

.blog-list2 .article .btn-out {
	width: 280px;
	bottom: auto;
	top: 50%;
	left: auto;
	right: 0;
	margin: -28px 0 0 0;
}

.blog-list2 .article-out {
	width: 100%;
	float: left;
	padding: 0 60px 0 60px;
	margin: 0 0 -30px 0;
}
}

@media (max-width: 991px) {
.blog-list2 .article aside {
	padding: 0 185px 0 230px;
}

.blog-list2 .article .btn-out {
	width: 185px;
}
}

@media (max-width: 767px) {
.blog-list2 {
	padding: 44px 0 50px 0;
}

.blog-list2 h2 {
	padding: 0 15px 49px 15px;
}

.blog-list2 .article {
	width: 100%;
	padding: 0 0 30px 0;
}

.blog-list2 .article p {
	padding: 0 0 27px 0;
}

.blog-list2 .article figure {
	display: none;
}

.blog-list2 .article aside {
	padding: 25px 20px 30px 20px;
	margin: 0;
}

.blog-list2 .article .btn-out {
	width: 100%;
	position: relative;
	margin: 0;
}

.blog-list2 .article-out {
	padding: 0 15px;
	margin: 0 0 -30px 0;
}
}


/*
 8.) Blog - Article
----------------------------------------*/

/* Banner - Blog2 */


/* Blog - Content */

/* DPI */

/* ----------- Non-Retina Screens ----------- */

/* ----------- Retina Screens ----------- */


/* Comments - Block  */


/* Comments - Info */


/* Right - Side - Bar */


/* 
 9.) Customer Reviews - Page
----------------------------------------*/

/* Banner - Inner */


/* Customer - Reviews */


/* Form - Block2 */


/* Two - Col - Articles */


/* 
 10.) Hosting - Page
----------------------------------------*/

/* Banner - Inner2 */

@media (max-width: 375px) { /*359*/
}


/* Team- - List */


/* Two - Col - Articles */


/* Two - Col - Articles2 */


/* Feature - List2 */


/* Gallery - Info */


/* Address - Block */


/* Video - Block */


/* FAQ - List */


/* 
 11.) Domain_name - Page
----------------------------------------*/

/* Banner - Inner3 */


/* Popular - Extensions */


/* Top10 - Extensions */


/* Interface - Slider */


/* Partners - Logos */


/* conditions */


/* Formulaire de commentaire */

.modal .modal-dialog.modal-video{
    max-width: 100%;
    height: 100%;
}

.modal .modal-dialog.modal-video .modal-content{
       height: calc(100% - 100px);
}

.modal .modal-dialog.modal-video .modal-content .modal-body{
    height: 100%;
    text-align : center;
}


@media (min-width: 900px) {
.modal-dialog {
	max-width: 730px;
}
}

.modal-content {
	border: none;
	border-radius: 10px;
}

.modal_video_1h .modal-header {
    border-bottom: none
}

.modal_video_1h .modal-content{
    box-shadow: none;
    background-color: transparent;
    border: none;
}

.modal_video_1h iframe {
    width: 100%;
    height: 100%;
    border: none;
}

a.top_nbr_avis {
    color: #fff;
}

a.top_nbr_avis:hover, a.top_nbr_avis:active, a.top_nbr_avis:focus {
    color: #fff;
    text-decoration: none;
    opacity: .70;
}

@media (max-width: 1023px) {
    a.top_nbr_avis {
        color: #17191c;
    }
}


/*BOUTON TOP*/
.top-link{
    position: fixed;
    bottom: 130px;
    right: -100px;
    padding: 7px 7px 9px;
    background-color: #01cc60;
    border-top-left-radius: 5px;
    color: #fff;
    transition: .2s;
    z-index: 99999;
    border: 2px solid #fff;
    border-right: none;
    border-bottom-left-radius: 5px;
}
.top-link:hover{    
    background: none repeat scroll 0 0 #27dd76;
}


/*FIN BOUTON TOP*/

/* To block lazy */

img{max-width: 100%; height: auto;}

/**** Ajout du 28/11/2019 ****/

.banner-fond-txt{
    filter: blur(60px);
    -webkit-filter: blur(60px);
    -moz-filter: blur(60px);
    -o-filter: blur(60px);
    -ms-filter: blur(60px);
    position:  absolute;
    width: calc(100% + 30px);
    height: calc(100% + 30px);
    z-index: -1;
    margin: -15px;    
} 
    
@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
          
@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/*******************************************************************************/
/*                                                                             */  
/*                            VERSION PC PORTABLE                              */
/*                                                                             */  
/*******************************************************************************/

@media (min-width : 1200px) and (max-width: 1299px) {
    
    /** général **/
    body,
    p{
        font-size: 16px;
        line-height : 22px;
    }
    
    p{
       padding: 0 0 12px 0;
    }
    
    h2{
        font-size: 30px;
        line-height: 38px;
        padding: 0 0 18px 0;
    }
    
    h3{
        font-size: 24px;
        line-height: 30px;
    }
    
    .btn, button, input[type="button"]{
        font-size: 18px;
        line-height: 24px;
    }
    
    /** padding **/
    
    
    .social-links,
    .footer-main .pre-footer,
    .blog-list2,
    .category-list,
    .blog-list,
    .add-info{
        padding: 35px 0 36px 0;
    }
    
    
    .blog-list2 h2,
    .blog-list h2{
        padding: 0 0 35px 0;   
        
    }
    
    /** Header **/
   
    /** Bannière **/    
    
    
    .banner-blog{
        padding: 140px 0 35px 0;
    }
    
    
    .banner-blog .banner-cont h1{
        font-size: 47px;
        line-height: 52px;
        padding: 0 0 18px 0;
    }
    
    
	.banner-blog .banner-cont aside{
        padding: 0 0 27px 0;    
    }
    
    
    /** Bannière adwords **/
    
    
    /* Bandeau bas promo */
    
    /** Footer **/
    .footer-main .copy-rights .logos-out ul li{
        margin: 0 25px 35px 25px;
    }
    
    /** Barre des logos **/
        
    /** onglets Formule + Caractéristiques **/

    /** Pourquoi top **/
    
    /** Bandeau puissance **/
    
    .cta-cont{
        padding: 35px 0;
    }
    
    .cta-cont aside{
        width: 65%;
    }
    
    .cta-cont .btn-out{
        width: 35%;
    }
    
    /** Bloc satisfait ou remboursé **/

    /** Bloc deux colonnes articles **/
    
    /** Bloc video **/
    
    /** Bloc FAQ **/    
    
    /** Bloc statistiques **/    
    
    /** Bloc reseaux sociaux **/
     
    .social-links ul li img {
        max-width: 39px;
    }
    
    /** Bloc récompense **/
    
    /** Bloc " 3 étapes" **/
    
    /** Bloc Extensions Populaire **/
    
     /** Bloc Top10 Extensions **/
    
    /** Logo partenaire **/ 
}

@media (min-width: 1024px) and (max-width: 1400px) {
	.header-main .nav-bar .top-bar-right .ratings-cont {
		display: none;
	}
}

/*******************************************************************************/
/*                                                                             */  
/*                              VERSION TABLETTE                               */
/*                                                                             */  
/*******************************************************************************/

@media (min-width : 1024px) and (max-width: 1199px) {
    
    .header-main .nav-bar .top-bar-right{
        /*display: none;*/
	}
	
	.header-main .nav-bar .top-bar-right .ratings-cont {
		display: none;
	}

    .header-main .brand img{
        width: 80%;
    }   
   
    .header-main .nav-bar .main-nav ul li{
        margin : 0 0 0 15px;
    }
   
    .header-main .nav-bar .main-nav ul li > a{
        font-size: 16px;
    }
   
   .header-main.fixed .nav-bar .btn-scr {
        display: none;
    }
    
    .header-main.fixed .nav-bar .main-nav{
        padding: 0 0px 0 242px;
    }
    
    .header-main.fixed .nav-bar .main-nav ul li{
        margin: 0 5px;
    }
   
}

@media (min-width : 992px) and (max-width: 1199px) {
    
    /** général **/
    body,
    p{
        font-size: 16px;
        line-height : 22px;
    }
    
    p{
       padding: 0 0 12px 0;
    }
    
    h2{
        font-size: 30px;
        line-height: 38px;
        padding: 0 0 18px 0;
    }
    
    h3{
        font-size: 22px;
        line-height: 28px;
    }
    
    .btn, button, input[type="button"]{
        font-size: 17px;
        line-height: 22px;
    }
    
    /** padding **/
    
    
    .social-links,
    .footer-main .pre-footer,
    .blog-list2,
    .category-list,
    .blog-list,
    .add-info{
        padding: 35px 0px 36px 0px;
    }
    
    
    .blog-list2 h2,
    .blog-list h2{
        padding: 0 60px 35px 60px;    
        text-align: center;
    }
    
    
    
    /** Header **/
   
    /** Bannière **/
    
    
    
    .banner-blog{
        padding: 140px 0 35px 0;
    }
    
    
    .banner-blog .banner-cont h1{
        font-size: 47px;
        line-height: 52px;
        padding: 0 0 18px 0;
    }
    
    
    .banner-blog .banner-cont aside{
        padding: 0 0 27px 0;    
    }
    
    .banner-blog .banner-cont aside{
        padding: 0px;   
    }
    
    
    /** Bannière adwords **/
    /*.banner-main .quick-report .countdown-section .countdown-amount {
        font-size: 45px;
	line-height: 50px;
    }
    
    .banner-main .banner-cont,
    .banner-main .quick-report{
        padding: 0 0 30px 0;
    }    
    
    .banner-main .quick-report{
        min-height: 111px;
    }
    
    .banner-main .banner-cont-out{
        width: 100%;
    }
    
    .banner-main .prize-cont {
        width: 40%;
        top: auto;
        left: 60%;
        padding: 0 0 0 2%;
        bottom: -25px;
    }
    
    .banner-main .prize-cont .offer-txt{
        font-size: 30px;
        line-height: 36px;
        padding: 0px 0px 20px 0px;
        vertical-align: top;
        margin: -9px 0px 0px -40px;
    }
    
    .banner-main .prize-cont .prize{
           font-size: 220px;
        line-height: 1;
    }
    
    .banner-main .prize-cont .prize sup{
        top: 22%;
        right: 3%;
        font-size: 70px;
    }
    
    .banner-main .prize-cont .prize sub{
        font-size: 40px;
        margin: 0px 0px 0px -54px;
    }
    
    .banner-main .prize-cont .prize .txt1{
        font-size: 150px;
        margin: 0 0 0 -15px;
    }
    
    .banner-main .prize-cont .offers{
        width: 134px;
        height: 134px;
        font-size: 40px;
        line-height: 134px;
        margin: 13px 0px 0 -30px;
    }
    
    .banner-inner-tiny{
        padding: 120px 0 0px 0;
    }*/
    
    
    /* Bandeau bas promo */
    
    /** Footer **/
    .footer-main .copy-rights .logos-out ul li{
        margin: 0 25px 35px 25px;
    }
    
    /** Barre des logos **/   
    
        
    /** onglets Formule + Caractéristiques **/

    /** Pourquoi top **/
    
    /** Bandeau puissance **/
    
    .cta-cont{
        padding: 35px 0;
    }
    
    .cta-cont aside{
        width: 65%;
    }
    
    .cta-cont .btn-out{
        width: 35%;
    }
    
    /** Bloc satisfait ou remboursé **/

    /** Bloc deux colonnes articles **/
    
    
    /** Bloc video **/
    
    /** Bloc FAQ **/    
    
    /** Bloc statistiques **/   
    
    /** Bloc reseaux sociaux **/
     
    .social-links ul li img {
        max-width: 39px;
    }
    
    /** Bloc récompense **/
    
    /** Bloc " 3 étapes" **/
    
    /** Bloc Extensions Populaire **/
    
     /** Bloc Top10 Extensions **/
    
    /** Logo partenaire **/
    
    /** Blog **/

}


@media (min-width : 768px) and (max-width: 991px) {
    
    /** général **/
    body,
    p{
        font-size: 16px;
        line-height : 22px;
    }
    
    p{
       padding: 0 0 12px 0;
    }
    
    h2{
        font-size: 30px;
        line-height: 38px;
        padding: 0 0 18px 0;
    }
    
    h3{
        font-size: 22px;
        line-height: 28px;
    }
    
    .btn, button, input[type="button"]{
        font-size: 17px;
        line-height: 22px;
    }
    
    /** padding **/
    
    
    .social-links,
    .footer-main .pre-footer,
    .blog-list2,
    .category-list,
    .blog-list,
    .add-info{
        padding: 35px 0px 36px 0px;
    }
    
    
    .blog-list2 h2,
    .blog-list h2{
        padding: 0 60px 35px 60px;    
        text-align: center;
    }
    
    
    
    /** Header **/
   
    /** Bannière **/
    
    
    .banner-blog{
        padding: 140px 0 35px 0;
    }
    
    
    .banner-blog .banner-cont h1{
        font-size: 47px;
        line-height: 52px;
        padding: 0 0 18px 0;
    }
    
    
    .banner-blog .banner-cont aside{
        padding: 0 0 27px 0;    
    }
    
    .banner-blog .banner-cont aside{
        padding: 0px;   
    }
    
    /** Bannière adwords **/    
    
    /* Bandeau bas promo */
    
    /** Footer **/
    .footer-main .copy-rights .logos-out ul li{
        margin: 0 25px 35px 25px;
    }
    
    .footer-main .pre-footer .article {
        width: 100%;
        margin: 0 0% 35px 0%;
    }
    
    .footer-main .pre-footer .article ul li {
        width: 33%;
        line-height: 22px;
        margin: 0 0 10px 0;
    }
    
    
    /** Barre des logos **/
        
    /** onglets Formule + Caractéristiques **/

    /** Pourquoi top **/
    
    /** Bandeau puissance **/
    
    .cta-cont{
        padding: 35px 0;
    }
    
    .cta-cont aside{
        width: 100%;
        text-align: center;
    }
    
    .cta-cont .btn-out{
        width: 100%;
        text-align: center;
        margin-top: 25px;
    }
    
    /** Bloc satisfait ou remboursé **/

    /** Bloc deux colonnes articles **/
    
    
    /** Bloc video **/
    
    /** Bloc FAQ **/    
    
    /** Bloc statistiques **/   
    
    /** Bloc reseaux sociaux **/
     
    .social-links ul li img {
        max-width: 39px;
    }
    
    /** Bloc récompense **/
    
    /** Bloc " 3 étapes" **/
    
    /** Bloc Extensions Populaire **/
    
     /** Bloc Top10 Extensions **/
    
    /** Logo partenaire **/
    
    /** Blog **/

}

/*******************************************************************************/
/*                                                                             */  
/*                               VERSION MOBILE                                */
/*                                                                             */  
/*******************************************************************************/


@media (max-width: 767px) {
    
    /** général **/
    body,
    p{
        font-size: 16px;
        line-height : 22px;
    }
    
    p{
       padding: 0 0 12px 0;
    }
    
    h2{
        font-size: 26px;
        line-height: 32px;
        padding: 0 0 18px 0;
    }
    
    h3{
        font-size: 22px;
        line-height: 28px;
    }
    
    .btn, button, input[type="button"]{
        font-size: 16px;
        line-height: 22px;
    }
    
    /** padding **/
    
    
    .social-links,
    .footer-main .pre-footer,
    .blog-list2,
    .category-list,
    .blog-list,
    .add-info{
        padding: 35px 0px 36px 0px;
    }
    
    .category-list{
         padding: 0;
    }
    
    
    .blog-list2 h2,
    .blog-list h2{
        padding: 0 15px 35px 15px;    
        text-align: center;
    }
    
    /** Header **/
   
    /** Bannière **/
    

    
    .banner-blog{
        padding: 80px 0 35px 0;
    }
    
    
    .banner-blog .banner-cont h1{
        font-size: 36px;
        line-height: 40px;
        padding: 0;
    }
    
    
    .banner-blog .banner-cont aside{
        padding: 0 0 27px 0;    
    }
    
    .banner-blog .banner-cont aside{
        padding: 0px;   
    }
    
    .banner-blog .banner-cont ul{
        padding: 24px 0 0 0;
	}
	
	.banner-blog .banner-cont aside p {
		margin-top: 24px;
	}
    
    /** Bannière adwords **/
    
    /* Bandeau bas promo */
    
    /** Footer **/
    .footer-main .copy-rights .logos-out ul li{
        margin: 0 25px 35px 25px;
    }
    
    .footer-main .pre-footer .article {
        width: 100%;
        margin: 0 0% 35px 0%;
    }
    
    .footer-main .pre-footer .article ul li {
        width: 100%;
        line-height: 22px;
        margin: 0 0 10px 0;
    }
    
    
    /** Barre des logos **/
    
        
    /** onglets Formule + Caractéristiques **/

    /** Pourquoi top **/
    
    /** Bandeau puissance **/
    
    .cta-cont{
        padding: 35px 0;
    }
    
    .cta-cont aside{
        width: 100%;
        text-align: center;
        padding: 0;
    }
    
    .cta-cont .btn-out{
        width: 100%;
        text-align: center;
        margin-top: 25px;
    }
    
    /** Bloc satisfait ou remboursé **/

    /** Bloc deux colonnes articles **/
    
    
    /** Bloc video **/
    
    /** Bloc FAQ **/    
    
    /** Bloc statistiques **/   
    
    /** Bloc reseaux sociaux **/
     
    .social-links ul li img {
        max-width: 39px;
    }
    
    /** Bloc récompense **/
    
    /** Bloc " 3 étapes" **/
    
    /** Bloc Extensions Populaire **/
    
     /** Bloc Top10 Extensions **/
    
    /** Logo partenaire **/
    
    /** Blog **/
    
    /*.blog-content .top-content h2{
        font-size: 24px;
        line-height: 26px;
        font-weight: 700;
        padding-bottom: 0px;
    }*/    
}

/* Alert in article */


/* Tips in article */

/* ADD 05/07/22 Bloc Border */

/* ADD 06/07/22 Custom Button */