/*
	Project		: svn eZPublish Actimage
	Author		: Maximilien LELEU <maximilien.leleu@actimage.com>
	Revision	: Décembre 2013
	Description	: Contient l’ensemble des règles pour la version mobile (méthode Responsive Web Design)
				 => Prise en compte si l'écran est plus grand que 0 ET plus petit ou égal à 980px

	Copyright	: ACTIMAGE
*/
/* Gestions des blocs non réactifs sur interface tactiles*/
.reactive:hover .show,
.reactive:focus .show,
.reactive .hide {
  display: block;
}
.reactive {
  display: block;
  -webkit-animation-duration: 0s;
  animation-duration: 0s;
  -webkit-animation-fill-mode: none;
  animation-fill-mode: none;
}
/* Structure générale */
body {
  background-color: #FFF;
}
#page,
#page #content #content-1,
#page #content #content-2,
#wrapper,
#footer,
.select-menu {
  display: block;
  width: 100%;
}
#content.cols2 #content-1,
#content.cols2 #content-2 {
  width: 100%;
}
#content.cols2 #content-1 {
  padding-right: 0;
}
.select-menu {
  border: 4px solid #767676;
  font-size: 1.5em;
  margin: 5px 1% 0 1%;
  padding: 2px;
  min-height: 30px;
  width: 98%;
}
/* Eléments à cacher */
#banner > ul,
#footer > div > ul,
.nav-corner,
.print-preview,
.js-toggle-group,
#header .action-list ul,
.fieldset-like .action-detail,
#basket .fieldset-like p,
#basket .read-all,
#generated-basket .fieldset-like p,
#generated-basket .read-all,
#newsletter-subscribe-footer {
  display: none;
}
/* Structure du header */
/* Banner */
#banner,
.note.full.alternate .header-note > div {
  display: table;
  width: 100%;
}
#banner #language img {
  box-shadow: none;
  padding: 5px;
}
#banner > * {
  display: table-cell;
  float: none;
}
#banner .select-menu {
  border-color: #FFF;
  margin: 0;
}
#banner #quick-search,
#generated-quick-search {
  border-radius: 0;
  font-size: 1.5em;
  padding: 5px;
  position: relative;
}
#banner input[type=submit],
#header #generated-quick-search input[type=submit] {
  background: url(../../images/base/icons/icon-search-input-rwd.png) center center no-repeat transparent;
  height: 24px;
  margin: 0;
  padding: 0;
  width: 24px;
  position: absolute;
  right: 10px;
  top: 5px;
}
#header #generated-quick-search input[type=submit] {
  right: 20px;
  top: 15px;
}
.quick-search #search-input,
.quick-search #search-submit,
#generated-quick-search #search-input #generated-quick-search #search-submi {
  display: table-cell;
}
#banner .quick-search #search-input,
#header #generated-quick-search #search-input {
  padding-right: 35px;
  width: 100%;
}
/* Banner */
#header {
  display: table;
  table-layout: fixed;
  width: 100%;
}
#header > * {
  display: table-cell;
}
#header .js-toggle-group,
#ezwt {
  display: none;
}
#header-column1 {
  width: 50%;
}
.header-box legend,
.header-box .legend-like {
  background-position: left 0.2em;
  font-size: 1.5em;
}
/* Box Connexion */
div#login-form {
  margin: 20px 0;
  width: 100%;
}
.action-list {
  background-color: #fba606;
  border: 2px solid #fba606;
}
.action-list {
  display: block !important;
  position: static !important;
}
#generated-login-form p {
  display: table-cell;
  padding: 0 2px;
}
#generated-quick-search #search-input {
  border: 4px solid #767676;
  padding: 5px;
}
#login-form {
  margin-bottom: 0;
}
#login-form fieldset,
#generated-login-form fieldset {
  padding-top: 20px;
}
#login-form + ul {
  display: block;
  margin: 0 15px 10px 15px;
  padding: 0;
  width: 100%;
}
#login-form + ul li {
  background: url(../../images/base/background/list-triangle-style4.png) left 4px no-repeat transparent;
  display: inline-block;
  list-style: none;
  margin-right: 10px;
  padding: 2px 0 2px 15px;
  vertical-align: top;
}
/* Panier et newsletter */
#header-column2 {
  width: 30%;
}
#basket .action-list,
#generated-basket .action-list {
  padding-bottom: 5px;
}
#newsletter-subscribe fieldset,
#generated-newsletter-subscribe fieldset {
  padding: 24px 8px 4px 8px;
  position: relative;
}
#newsletter-subscribe fieldset > p,
#generated-newsletter-subscribe fieldset > p {
  display: block;
  font-size: 1.4em;
}
#newsletter-subscribe input[type=email],
#generated-newsletter-subscribe input[type=email] {
  border: 4px solid #767676;
  display: block;
  padding: 5px 35px 5px 4px;
  width: 100%;
}
#newsletter-subscribe input[type=submit],
#generated-newsletter-subscribe input[type=submit] {
  position: absolute;
  top: 30px;
  right: 15px;
}
/* Gestion des publicités */
.advertise {
  border: none;
}
.advertise a,
.advertise img {
  max-width: 100%;
  width: auto;
}
#content-2 > .advertise {
  padding: 5px;
  margin: 20px 0;
  text-align: center;
  width: 100%;
}
#content-2 > .advertise a {
  margin: auto;
}
/* Adaptation du contenu */
#content {
  font-size: 1.3em;
  margin-bottom: 20px;
}
#content + .advertise {
  margin-bottom: 20px;
}
/* Gestion du gabarit alternatif : bug firefox : float + overflow */
#content.alternate #content-2 {
  float: none;
}
.alternate #breadcrumb,
.alternate h1,
.alternate .article-intro,
.alternate .article-info,
.alternate .article-suggest {
  overflow-x: auto;
}
.wysiwyg img,
video,
.wysiwyg table,
.chart table {
  max-width: 100%;
}
figure {
  max-width: 100% !important;
}
/* Préférences produits */
.full.preference .grid4 > *,
.full.subscription .list .inbl-list.grid4 > * {
  width: 50%;
}
.full.preference li li {
  margin: 4px auto;
}
/* Footer */
#footer .container > *:not(script) {
  display: inline-block;
  width: 50%;
  padding: 10px;
}
/* Pagination */
.pagination ul .prev {
  left: -80px;
}
.pagination ul .next {
  right: -56px;
}
.left + p {
  margin-top: 0;
}
/* Lightbox RWD */
.lb-dataContainer {
  width: auto !important;
}
.lb-image {
  max-width: 100%;
}
.lb-container {
  width: 100%;
}
.lb-outerContainer,
.ui-dialog {
  height: auto !important;
  width: 100% !important;
}
.note.full .w50 {
  width: 100%;
}
.trend img {
  margin: 5px auto;
}
.owl-item .buttons,
.owl-item .buttons > * {
  display: block;
  width: 100%;
}
