.articlesList { margin: 0 25px; }
.articleCategory { text-align:center; }
.articleBreadcrumb, .articleTitle {
    text-decoration: none;
    color: #525252;
    font-weight: bold;
}
.articleTitle {
    margin: 0px 25px;
}
.articleBreadcrumb {
    font-size: 16px;
    font-weight: bold;
}
#articlesTestsBreadcrumb {
    display: flex;
    align-items: center;
    margin-bottom: 18px;
    padding: 0 15px;
}
#articlesTestsBreadcrumb .articleBreadcrumb {
    margin: 0;
    padding: 0;
}
.articleBreadcrumb li {
    display: inline;
}
.articleTitle {
    text-align: left;
    font-size: 36px;
    color: var(--orange-color);
    font-weight: bold;
    text-transform: uppercase;
    font-family: "Trebuchet MS", Arial;
    letter-spacing: -2px;
}
.articlesCounter { margin: 20px 30px 40px 30px; color: #525252; font-size: 16px; }
.articleSubCategories, .articlesOfCategory { width: 100%; }
.articleSubCategories td, .articlesOfCategory td { padding: 5px 10px; }
a.articleTitle { color: #000000; }

div.article-contentWrapper, div.article-sourceWrapper {
    width: 1100px;
    margin: 0 auto 15px auto;
    position: relative; /* for absolute position of children */
    font-size: 111%;
    line-height: 140%;
    font-family: Helvetica,Arial,FreeSans,sans-serif;
    color: #16212c;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.article-contentWrapper a {
    border-bottom: 1px dotted #747b83;
}

.article-contentWrapper h2 a {
    border: none;
}

.article-contentWrapper p {
    margin: 10px 0 0 0;
}

.article-contentWrapper a.sepalink {
    float:right;
    padding-left:0;
    padding-top: 1.5em;
}

div.article-contentWrapper table {
    border-collapse: collapse;
}
div.article-contentWrapper td, div.article-contentWrapper th {
    border: 1px solid lightgrey;
    padding: 5px;
}

div.article-contentWrapper h2 {
    margin: 0 0 1em 0;
    font-size: 30px;
    letter-spacing: -2px;
    text-align: left;
    font-family: "Trebuchet MS", Arial;
    font-variant: small-caps;
    color: var(--anthracite-color);
    clear:both;
    line-height:1em;
    margin-top: 100px;
}
div.article-sourceWrapper {
    text-align: right;
    font-size: 90%;
    margin-top: 50px;
}

div.article-soustitre { font-size: 18px; padding: 5px 0; }
div.article-chapeau { font-size: 18px; padding: 5px 0;  }
div.article-encadre { margin: 10px 0px; padding: 10px; clear: both;  }
div.article-encadre-50-pourcents-gauche, div.article-encadre-50-pourcents-droite {
    margin: 10px 0;
    padding: 10px;
    display: inline-block;
    vertical-align: top;
    width: 520px;
}
div.article-encadre-50-pourcents-droite {
    margin-left: 12px;
}
div.article-encadre_titre {
    margin: 0px 0px 10px 0px;
    padding-bottom: 8px;
    font-size: 30px;
    letter-spacing: -2px;
    text-align: left;
    font-family: "Trebuchet MS", Arial;
    font-variant: small-caps;
    color: var(--anthracite-color);
    border-bottom: 1px solid var(--gray-light-color);
}
div.article-encadre_texte {
    text-align: justify;
    padding: 10px;
}
div.article-texte { font-size: 16px; text-align: justify; }
div.article-texte:after {
    /* clearfix */
    content: "";
    display: table;
    clear: both;
}
div.article-texte-subtitle {
    font-size: 24px;
    font-weight: bold;
    letter-spacing: -2px;
    text-align: left;
    font-family: "Trebuchet MS", Arial;
    font-variant: small-caps;
    color: var(--anthracite-color);
    padding-top: 40px;
    padding-bottom: 20px;
    clear:both;
}

div.conteneur-texte-image { display: block; }
div.conteneur-texte-image:after {
    content:"";
    display:table;
    clear:both;
}

ul.liste-puces, ul.liste-puces li { list-style: disc inside; }
ul.liste-puces-oranges {
    list-style: none;
    padding:0;
    margin:0;
}
ul.liste-puces-oranges li {
    padding-left: 1em;
    text-indent: -.7em;
}
ul.liste-puces-oranges li:before {
    content: "• ";
    color: var(--orange-color);
}


span.stars,
span.stars span {
    display: inline-block;
    background: transparent url("/themes/naturabuy/img/flat-stars.png") repeat-x scroll 0px -24px;
    width: 130px;
    height: 24px;
    line-height: 24px;
    vertical-align: top;
    text-align: left;
}
span.stars-big,
span.stars-big span {
    background-image:url("/themes/naturabuy/img/flat-stars-big.png");
    background-position: 0px -48px;
    width: 260px;
    height: 48px;
    line-height: 48px;
}
span.stars span {
    background-position: 0px 0px;
    display: block;
}
span.stars-big-label {
    font-size: 16px;
    line-height: 55px;
    padding-right: 10px;
}

.notenb {
    font-family: "Trebuchet MS", Arial;
    display:inline-block;
    width:49%;
    text-align: left !important;
    font-weight: bold;
    margin-top: 20px !important;
}

img { max-width: 100%; }
.image { max-width: 100%; }

.image-left { float: left; margin: 2em 2%; width: 45%; text-align: center;}
.image-center { text-align: center; margin: 2em; clear:both}
.image-right { float: right; margin: 2em 2%; width: 45%; text-align: center; }

div.article-contentWrapper figcaption { font-style:italic; font-size: 85%; padding: 5px 18% 0;}
.captionSuggestion { transition: background-color 0.3s ease-out; }
.captionSuggestion:hover { background-color: rgba(0,0,0,0.1); }

#article-notes  { margin-bottom: 2em; }
#article-notes p { line-height: 30px; width: 50%; position: relative;}
#article-notes span.stars { position: absolute; right: 0; }
#article-plus div.article-encadre_titre, #article-moins div.article-encadre_titre { color:var(--orange-color);  }
#article-plus div.article-encadre_texte, #article-moins div.article-encadre_texte { font-weight: bold; }
#balle-verdict { color:var(--orange-color); }

.clear { clear: both; }
.categoriesList > div {  margin-top: -20px; display: block; overflow: auto; min-height: 300px; background-repeat:no-repeat; background-position: right bottom; }
.categoriesList > div.catTiles { margin-top: -20px; min-height: 185px; background-repeat:no-repeat; background-position: right bottom; }
.categoriesList > div.catTiles ul { position: relative; }
div.categoryTile {
    display: table;
    height: 64px;
    position: absolute;
    bottom: 0;
    width: 100%;
    color: black;
    font-weight: bold;
    background: rgba(255, 255, 255, 0.7);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#5FFFFFFF,endColorstr=#5FFFFFFF);
}

div.categoryTile span.catName { display: table-cell; vertical-align: middle; padding: 0px 1em; }
span.catName { font-size: 20px; font-weight: bold; display: table-cell; vertical-align: middle; padding: 0px 1em; margin: 0 auto;}

.articlesCategories { position:relative; float:left; width: 22%; text-align: center; background-color: whitesmoke; margin: 16px; }
.articlesCategories.smallTile { display: table; width: 28%; padding: 0px 1em 1em; background: linear-gradient(rgba(245, 245, 245, 0.5), rgba(245, 245, 245, 0.5)); }
.articlesCategories.smallTile > a > p.catNbArt { font-size: 35px; font-weight: bold; }
.articlesCategories.bigTile { height: 200px; min-width: 243px; text-shadow: #FFFFFF 1px 1px, #FFFFFF -1px 1px, #FFFFFF -1px -1px, #FFFFFF 1px -1px; box-shadow: 2px 2px 18px 0px rgba(154,154,154,0.1); }
.articlesCategories.bigTile:hover { box-shadow: none; }
.articlesCategories.bigTile > div { height: 100%;  background-repeat:no-repeat; background-position-x: -300px; background-position-y: bottom; }
li.articlesCategories.chasse div.cattest1406 { background-position-x: -410px; }
li.articlesCategories.chasse div.cattest559 { background-position-x: -200px; }
li.articlesCategories.peche div.cattest360 { background-position-x: -415px; background-position-y: -160px; }
.articlesCategories > div > a > div { height: 100%; }
.articlesCategories > div > a > div:hover {
    background: rgba(255, 255, 255, 0.6);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#6FFFFFFF,endColorstr=#6FFFFFFF);
}
.articlesCategories:hover { color: grey; }

#lastTestsByMonths { margin-right: 25px; }

.searchResultHeader { padding: 10px 0px; display: inline-block; width: 100%; }

.articleTestContainer > div { height: 400px; background-color: white; display: inline-block; width: 100%; }
.articleTestContainer > div > a > h2 { text-align: center;  background-color: #ACACAC; color: white; font-size: 33px; margin-bottom: 0px; padding: 5px; }
.articleTestContainer > div > a > h2:hover { color: #e9e3df; }
.articleTestContainer > div > div.left { width: 50%; text-align:center; }
.articleTestContainer > div > div.left > img { max-height: 340px; max-width: 99%; vertical-align: middle; margin-top: 5px; margin-bottom: 5px; }
.articleTestContainer > div > div.left > span.helper { display: inline-block; height: 100%; vertical-align: middle; }
.articleTestContainer > div > div.right { position: relative; width: 50%; font-size: 16px; }
.articleTestContainer > div > div.right > div.rightHeader { padding: 1em 2em; }
.articleTestContainer > div > div.right > div.rightHeader > span.infos { display: inline-block; padding-top: 17px; }
.articleTestContainer > div > div.right > div.rightHeader > span.infos.date { position: absolute; right: 2em; }
.articleTestContainer > div > div.right > div.rightHeader > span.stars { transform: scale(0.6); -ms-transform: scale(0.6); }
.articleTestContainer > div > div.right > div.rightContent > p { padding: 1em 2em; }
.articleTestContainer > div > div.right > div.rightContent > p.paragraph { padding: 2em; }
.articleTestContainer > div > div.right > div.rightFooter { position: absolute; bottom: 50px; width: 100%; text-align: center; }
.articleTestContainer > div > div.right > div.rightFooter > a.button,
.articleTestContainer > div > div.right > div.rightFooter > a.button { margin: 0px 15px; }
.articleTestContainer > div > div { height: 351px; }
.articleTestContainerNotRecommanded > div { margin-top: 30px; }
.articleTestContainerNotRecommanded > div a h2 { background-color: #4b6b4d }
.articleTestContainerNotRecommanded > div a h2:hover { color: rgb(103, 142, 105); }

.bigTitle { font-size: 37px; margin-bottom: 30px; }
.supersepa.recommandedTest.bigTitle > .iconorange { vertical-align: middle; position: relative; top: -7px; }
.showMoreLink { margin-top: 20px; font-size: 20px; margin-bottom: 100px; overflow: hidden; }
.showMoreLink a { float: right; }
.showMoreLink .sepalink { position: static; }

#guideAchat { margin: 80px 10px; }
#guideAchat div { min-height: 370px; }
table.annoncesTable {
    table-layout: fixed;
}
table.annoncesTable > tbody > tr > td.title {
    width: 390px;
    display: block;
    padding-left: 2em;
}
table.annoncesTable > tbody > tr > td.title a span {
    display: block;
    width: 400px;
    text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
table.annoncesTable > tbody > tr > td.price { width: 120px; text-align: right; }
table.annoncesTable > tbody > tr > td { padding: 7px 2px; }

.dropdown { padding: 5px; background-color: white; border: 1px solid #ccc; }
.arrow-down-sort { background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%), linear-gradient(to right, #ccc, #ccc); background-position: calc(100% - 10px) calc(1em - 2px), calc(100% - 5px) calc(1em - 2px), calc(100% + 0.5em); background-size: 5px 5px, 5px 5px, 1px 1.5em; background-repeat: no-repeat; }
#selectCritereMarque { width: 75px; cursor: default; }
#selectCritereMarque > span { padding: 0px 5px; }
#formCritereBrand { height: 100px; overflow-y: auto; width: auto; padding: 15px 5px; }
#selectCritereMarqueDropdown { min-width: 210px; position: absolute; z-index: 2; }
#selectCritereMarqueDropdown > div > div.dropdownClose { text-align: center; padding-top: 10px; }
#selectCritereMarqueDropdown > div > div.dropdownClose > button { background-color: whitesmoke; border: 1px solid #ccc; }
#selectCritereMarqueDropdown > div.dropdown { -webkit-box-shadow: 2px 2px 10px grey; -moz-box-shadow: 2px 2px 10px grey; box-shadow: 2px 2px 10px grey; }
#yourSelection > ul > li.dropdown > button { background: none; border: none; cursor: pointer; }
#yourSelection { margin: 5px 5px 5px 240px; }
#yourSelection > ul > li { margin: 0px 5px; }
#filterSortOptions > li { display: inline-block; margin: 0px 10px; }
#filterSortOptions > li > select { width: 210px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; }

.recommandedArticleAdmin { background-color: #ff7c27 !important; }
.recommandationButton { font-size: 18px; padding: 10px; margin-bottom: 20px; }
.recommandationButton p { text-align: center; }
.recommandationButton p .button { margin-top: 20px; margin-left: 20px; font-size: 17px; padding: 12px 24px; }
h1.currentlyRecommanded { margin-bottom: -70px; }

.iconbig.iconfa { width: 40px; height: 40px; margin-bottom: -7px; }
.articlesCounter h2 span { display: inline-block; }
.articlesCounter h2 a.sepalink { float: right; padding-left: 0; padding-top: 1.5em; }
