/*------------------------< PAGES LOGIN   >---------------------------*/

.card .form-control:focus{ border: 1px solid rgba(0,0,0,.15);}

#card_login fieldset{ width: 100%;}
#card_login label{ justify-content: left; padding-left: 0;}
#card_login .form-group{ margin-bottom: 0.5em;}
#card_login .input-group{ width: 100%;}
#card_login input{ border-left:none;}
#card_login .form-inline .input-group {  width: 100%;  }
.input-group-addon {  padding: .5rem 0 .5rem .7rem;  margin-bottom: 0;  font-size: 0.9rem;  font-weight: 400;  line-height: 1.25;  color: #999;  text-align: center;  background-color:transparent;  border-top: 1px solid rgba(0,0,0,.15);  border-bottom: 1px solid rgba(0,0,0,.15);  border-right:none;  border-radius: .25rem;  }

/* CHECKBOX REMEMBER ME */
.label--checkbox {  position: relative;  margin: .5rem 0;   line-height: 135%;  cursor: pointer;  }
.label--checkbox span{ display: inline-block; position: relative;  top:-6px;}
.checkbox {  position: relative;  top: -0.375rem;  margin: 0 1rem 0 0;  cursor: pointer;  }
.checkbox:before {  -webkit-transition: all 0.3s ease-in-out;  -moz-transition: all 0.3s ease-in-out;  transition: all 0.3s ease-in-out;  content: "";  position: absolute;  left: 0;  z-index: 1;  width: 1rem;  height: 1rem;  border: 2px solid #f2f2f2;  }
.checkbox:checked:before {  -webkit-transform: rotate(-45deg);  -moz-transform: rotate(-45deg);  -ms-transform: rotate(-45deg);  -o-transform: rotate(-45deg);  transform: rotate(-45deg);  height: .5rem;  border-color: #009688;  border-top-style: none;  border-right-style: none;  }
.checkbox:after {  content: "";  position: absolute;  top: -0.125rem;  left: 0;  width: 1.1rem;  height: 1.1rem;  background: #fff;  cursor: pointer;  }
.button--round {  -webkit-transition: 0.3s background ease-in-out;  -moz-transition: 0.3s background ease-in-out;  transition: 0.3s background ease-in-out;  width: 2rem;  height: 2rem;  background: #5677fc;  border-radius: 50%;  box-shadow: 0 0.125rem 0.3125rem 0 rgba(0, 0, 0, 0.25);  color: #fff;  text-decoration: none;  text-align: center;  }
.button--round i {  font-size: 1rem;  line-height: 220%;  vertical-align: middle;  }
.button--round:hover {  background: #3b50ce;  }
.button--sticky {  position: fixed;  right: 2rem;  top: 16rem;  }
@-moz-document url-prefix() { .checkbox{ margin-right: 0.5em} .label--checkbox span{ top:-6px;} }
@-webkit-keyframes slideUp {
    0% {  -webkit-transform: translateY(6.25rem);  transform: translateY(6.25rem);  }
    100% {  -webkit-transform: translateY(0);  transform: translateY(0);  }
}
@keyframes slideUp {
    0% {  -webkit-transform: translateY(6.25rem);  transform: translateY(6.25rem);  }
    100% {  -webkit-transform: translateY(0);  transform: translateY(0);  }
}

/*------------------------< REGISTER  >---------------------------*/

#register_page .form-inline fieldset{ width: 100%;}
#register_page .form-inline label{ justify-content: left; padding-left: 0;}
#register_page .form-group{ margin-bottom: 1em;}
#register_page .card_infos_compte label, #register_page .card_infos_compte input{ width: 50%;}
#register_page .card_infos_personnelles label{ width: 30%;}
#register_page .card_infos_personnelles input{ width: 70%;}
.card_register{ margin-bottom: 2em;}
.card_register .card-body, .card_request .card-body{ padding: 2em;}

input[type=submit], button{ cursor: pointer;}

/*------------------------< REQUEST  >---------------------------*/

.card_request .form-inline #email.form-control{ width: 65%; display: inline-block; margin: 0 0.5em;}
.noPad{ padding-left: 0; padding-right: 0;}

/*------------------------< STEPS CART  >---------------------------*/

.steps {  margin-bottom: 3em;  }
ol.progtrckr {  display: table;  list-style-type: none;  margin: 0;  padding: 0;  table-layout: fixed;  width: 100%;  }
ol.progtrckr li {  display: table-cell;  text-align: center;  line-height: 3em;  }
ol.progtrckr[data-progtrckr-steps="2"] li {  width: 49%;  }
ol.progtrckr[data-progtrckr-steps="3"] li {  width: 33%;  }
ol.progtrckr[data-progtrckr-steps="4"] li {  width: 24%;  }
ol.progtrckr[data-progtrckr-steps="5"] li {  width: 19%;  }
ol.progtrckr[data-progtrckr-steps="6"] li {  width: 16%;  }
ol.progtrckr[data-progtrckr-steps="7"] li {  width: 14%;  }
ol.progtrckr[data-progtrckr-steps="8"] li {  width: 12%;  }
ol.progtrckr[data-progtrckr-steps="9"] li {  width: 11%;  }
ol.progtrckr li.progtrckr-done {  color: #666;  font-weight: 600;  padding-bottom: 1em;  border-bottom: 4px solid #666;  }
ol.progtrckr li.progtrckr-todo {  color: #666;  border-bottom: 4px solid silver;  }
ol.progtrckr li:after {  content: "\00a0\00a0";  }
ol.progtrckr li:before {  position: relative;  bottom: -2.5em;  float: left;  left: 50%;  line-height: 1em;  }
ol.progtrckr li.progtrckr-done:before {  content: "\2713";  color: white;  background-color: #666;  height: 30px;  font-size: 1.2em;  font-weight: 800;  width: 30px;  line-height: 30px;  border: none;  border-radius: 50%;  }
ol.progtrckr li.progtrckr-todo:before {  content: "\039F";  color: silver;  background-color: #FFF;  font-size: 1.5em;  bottom: -2.3em !important;  }

/*------------------------< CONNEXION HEADER >---------------------------*/

#logout {  margin-bottom: 1em;  }
#logout a i {  margin-right: 0.3em;  }
#logout a{ display: inline;}
#logout a:first-child {  margin-right: 1.5em;  font-style: italic;  font-weight: 400;  }
#logout a:last-child {  margin-right: 1em;  font-weight: 600;  text-transform: uppercase;  }

#welcome { width: 100%; display: block; text-align: right;}
.actions_login{ width: 100%; display: block; text-align: right;}
#welcome p {  font-style: italic;  font-size: 0.8750em; color: #FFF  }
#welcome strong {  text-transform: uppercase;  }

#logout .btn {  font-size: 10px !important;  float: left;  margin-right: 1em;  }
.btnMyAccount {  text-transform: uppercase;  font-weight: 600;  float: left;  padding-top: 0.2em;  }

/*------------------------< LISTING PRODUCT >---------------------------*/

.price-promo-bloc div{ width: 50%; }
.price-promo{ float: left;}
.old-price{ float: right; text-decoration: line-through; text-align: right;}

.toolbar{ background-color: #efefef; padding: 1em; margin-bottom: 1em;}
.toolbar fieldset{ width: 100%;}
.toolbar .form-inline .form-group{ margin-bottom: 0;}
.toolbar label{ padding-right: 0.5em;}

/*------------------------< SHOW PRODUCT >---------------------------*/

.form-show-actions{ margin: 1em 0;}
.form-show-actions .form-group{ margin-bottom: 1em;}
.form-show-actions input[type=number], .form-show-actions select{ margin: 0 0.5em; width: 20%;}
#modalCart .price-modal{ font-size: 1.2em;}
.modal-body{ padding: 1.5em;}

.col-tab{ padding-top: 1.5em;}
.tab-content{ padding: 1.5em 1em;}

/* Rating Star Widgets Style */
.rating-stars ul {  list-style-type:none;  padding:0;  -moz-user-select:none;  -webkit-user-select:none; margin: 0 0 0.5em 0;  }
.rating-stars ul > li.star {  display:inline-block;  }
.rating-stars ul > li.star > i.fa {  font-size:1em; color:#ccc;  }
.rating-stars ul > li.star.hover > i.fa {  color:#333;  }
.rating-stars ul > li.star.selected > i.fa {  color:#FFCC36;  }

.avis-client{ border-bottom: #ccc dotted 1px; padding-bottom: 0.5em; margin-bottom: 1em;}

/*------------------------< SHIPPING and PAYMENT >---------------------------*/

.list-group{ margin: 1em 0;}
#billingAddress{ display: none;}
#mode_livraison_page .list-group-item .row{ width: 100%;  margin-right: 0;}
.list-group-item{ cursor: pointer;}
.list-group-item:not(.active):hover{ background-color: #f5f5f5;}
.list-group-item label{ margin-bottom: 0;}
.transport_item.radio_div{ padding-right: 0; padding-left: 0;}

.list-group-item h4{ font-weight: 600; margin-bottom: 0.5em;}
.list-group-item.active h4 a { color: #FFF;}

/*------------------------< ORDER SUMMARY >---------------------------*/

#order_recap_page .card-block{ padding: 1em 2em;}
#order_recap_page .line{ border-bottom: #CCC dotted 1px; padding: 0.2em 0; margin: 0.5em 0;}
#order_recap_page .line:last-child{ border-bottom: none;}
#order_recap_page .line span{ display: inline-block; float: right;}
#order_recap_page .line strong{ font-size: 1.2em;}
#order_recap_page textarea{ min-height:150px;}

/*---------------------------< MON COMPTE >----------------------------------*/

button{ outline: none !important;}
.bg-light {  background-color: #f8f9fa !important;  }
.navbar-brand{ float: left;}
#welcome_account{ float: left; /*padding-top: 0.5em;*/}
.navbar-account{ padding: 1em 1.5em; margin-bottom: 1.5em;}
.navbar-account .btn{ margin-left: 1em;}


.blocAccount {  text-align: center;  cursor: pointer;  margin: 1.5em 0;  }
.blocAccount:hover h4 a {  color: #58c5c2;  }
.iconAccount {  color: #ccc;  font-size: 6em;  font-weight: 600;  border: #efefef solid 1px;  border-radius: 4px;  }
.iconAccount:hover i {  color: #58c5c2;  }
.blocAccount h4 {  margin: 1em 0 0.5em 0;  }
.blocAccount h4 a {  color: #333;  }
.blocAccount h4 a:hover {  color: #58c5c2;  }
.blocAccount p.paragraphe{ text-align: center;}

.form-show-actions input[type=number], .form-show-actions select{ margin: 0 0.5em; width: 20%;}

/*---------------------------< ORDER LIST >----------------------------------*/

#order_page table, #order_page_show table, #order_recap_page table {  border: 1px solid #ccc;  width: 100%;  margin:1.5em 0 1em 0;  padding:0;  border-collapse: collapse;  border-spacing: 0;  }
#order_page table tr, #order_page_show table tr, #order_recap_page table tr {  border: 1px solid #ddd;  padding: 5px;  }
#order_page table th, #order_page table td, #order_page_show th, #order_page_show td, #order_recap_page th, #order_recap_page td {  padding: 10px;  text-align: center;  }
#order_page table th, #order_page_show table th, #order_recap_page th {  text-transform: uppercase;  font-size: 14px;  letter-spacing: 1px;  }
#order_page table td:before, #order_page_show table td:before, #order_recap_page td:before { color: #999;}
.td_product div.paragraphe{ overflow: hidden; height: 50px;}
.td_product .gestion_image { display : block;  overflow: hidden;  text-align: center;  background-position: center;  background-size: cover; background-repeat: no-repeat;  width : 20%;  }

@media screen and (max-width: 600px) {
    #order_page table, #order_page_show table, #order_recap_page table {  border: 0;  }
    #order_page table thead, #order_page_show table thead, #order_recap_page table thead {  display: none;  }
    #order_page table tr, #order_page_show table tr, #order_recap_page table tr {  margin-bottom: 10px;  display: block;  border-bottom: 2px solid #ddd;  }
    #order_page table tr, #order_page table tr:hover, #order_page_show table tr, #order_page_show table tr:hover, #order_recap_page table tr, #order_recap_page table tr:hover  { background-color: #FFF;}
    #order_page table td, #order_page_show table td, #order_recap_page table td  {  display: block;  text-align: right;  font-size: 13px; /* border-bottom: 1px dotted #ccc; */ }
    #order_page table td:last-child, #order_page_show table td:last-child, #order_recap_page table td:last-child{  border-bottom: 0;  }
    #order_page table td:before, #order_page_show table td:before, #order_recap_page table td:before {  content: attr(data-label);  float: left;  text-transform: uppercase;  font-weight: bold;  }
    #order_page table td.detail_order{ display: none;}
    #order_page table td.td-state{ border-bottom: none;}
    .total-order{ float: left !important;}
    .table td.td_product{ border-top: 0;}
   /* #order_recap_page .line span{ float: none; display: block; width: 100%;}*/
}

.table-order .alert{ display: inline-block; font-size: 12px; padding: 0.5em 1em; margin-bottom: 0;}
.total-order{ font-size: 1.2em;}

/*---------------------------< INFOS COMPTE >----------------------------------*/

.card{ margin: 1em 0;}
#account_infos_page .card-block{ margin: 0 0 1em 0;}
#account_infos_page .card-block [class*="col"]{ padding-left: 0; padding-right: 0;}
#account_infos_page .card-block .row{ border-bottom: #999 dotted 1px; width: 100%; margin-left:0; margin-right: 0; padding: 0.5em 0; }
#account_infos_page .card .btn-primary{ margin-top: 1em;}

.form-inline .form-group{ margin-bottom: 1em;}
#edit_infos_page fieldset{ width: 100%;}

form legend, legend{ border-bottom: solid 1px #666; padding-bottom: 0.3em; margin-bottom: 0.5em;}

/*---------------------------< AVIS >----------------------------------*/

#avis .productListing {  padding-top: 0;  }
#avis .productListing h4, #avis .productListing h4 a {  margin-top: 0;  }

#avis .productListing .paragraphe {  font-size: 0.750em;  font-style: italic;  margin-bottom: 0;  }
#avis .productListing textarea {  font-size: 0.750em !important;  min-height: 120px;  max-height: 120px;  }
#avis .productListing ::-webkit-input-placeholder {  color: #333;  font-style: italic;  font-size: 12px;  }
#avis .productListing :-moz-placeholder {  color: #333;  font-style: italic;  font-size: 12px;  }
#avis .productListing ::-moz-placeholder {  color: #333;  font-style: italic;  font-size: 12px;  }
#avis .productListing :-ms-input-placeholder {  color: #333;  font-style: italic;  font-size: 12px;  }

/*---------------------------< CART QUANTITY BUTTONS >----------------------------------*/
#loading
{
    padding: 10px;
    background: #333;
    color: #fff;
    text-align: center;
    font-weight: bold;
    font-size: 17px;
    display: none;
}

.quantity {
    position: relative;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button
{
    -webkit-appearance: none;
    margin: 0;
}

input[type=number]
{
    -moz-appearance: textfield;
}

.quantity input {
    width: 100%;
    height: 42px;
    line-height: 1.65;
    float: left;
    display: block;
    padding: 0;
    margin: 0;
    padding-left: 20px;
    border: 1px solid #eee;
}

.quantity input:focus {
    outline: 0;
}

.quantity-nav {
    float: left;
    position: relative;
    height: 42px;
}

.quantity-button {
    position: relative;
    cursor: pointer;
    border-left: 1px solid #eee;
    width: 20px;
    text-align: center;
    color: #333;
    font-size: 13px;
    font-family: "Trebuchet MS", Helvetica, sans-serif !important;
    line-height: 1.7;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.quantity-button.quantity-up {
    position: absolute;
    height: 50%;
    top: 0;
    border-bottom: 1px solid #eee;
}

.quantity-button.quantity-down {
    position: absolute;
    bottom: -1px;
    height: 50%;
}

/*---------------------------< TABLE CART >----------------------------------*/

.table#cart td, .table#cart th{ vertical-align: middle; text-align: center;}
.table#cart td.td_product, .table#cart th.th_product{ text-align: left;}

.td_product .gestion_image { display : block;  overflow: hidden;  text-align: center;  background-position: center;  background-size: cover; background-repeat: no-repeat;  width : 20%;  }
.td_product .paragraphe--bis {height : 78px; overflow : hidden;}
.td_product--title {height : 19px; overflow : hidden;}
.td_product--content {width : 80%; margin-left : 1em; }
.td_product--title {color : #d41929; font-weight : 600; font-size : 16px; }


/*---------------------------< CODE PROMO >----------------------------------*/

#cart_page .card{ margin-bottom: 1em;}
#card_code form{ padding: 1em 0 0 0;}
#card_code fieldset{ width: 100%;}
#card_code .form-group{ margin-bottom: 0;}
#card_code input[type=text]{ margin: 0 0.5em; display: inline-block;}

/*---------------------------< MEDIAQUERIES >----------------------------------*/
/*---------------------------< MEDIAQUERIES >----------------------------------*/
/*---------------------------< MEDIAQUERIES >----------------------------------*/

@media screen and (max-width:2200px) {
    .navbar-toggler{ display: none}
}

@media screen and (max-width:992px) {
    .table-hover tbody tr:hover {  background-color:transparent;  }
    #register_page .card_infos_compte input{ width: 100%;}
    #register_page .card_infos_personnelles label, #register_page .card_infos_compte label { width: 100%; margin-bottom: 0.5em;}
    #register_page .card_infos_personnelles input{ width: 100%;}
    #card_login .input-group[class*="col"]{ padding-left: 0; padding-right: 0;}
    #card_login label{ margin-bottom: 0.5em;}
}
@media screen and (max-width: 768px) {
    .actions button{ width: 100%;}
    .actions button:first-child{ margin-bottom: 0.5em;}
    .navbar-toggler { display: block !important;}
    .btn-account-default{ display: none;}
    .navbar-nav{ display: inline-block;}
    #navbarNav{ padding: 1em 0 0 0;}
    #navbarNav .navbar-nav li.nav-item{ width:auto; float: left; display: inline;}
    #navbarNav .btn{ margin-left: 0; margin-right: 1em;}
    .card{ margin-bottom: 1.5em;}
    .label_false{ display: none;}
}

@media screen and (max-width: 615px) {
    ol.progtrckr li.progtrckr-done, ol.progtrckr li.progtrckr-todo{ font-size: 12px;}
}

@media screen and (max-width: 600px) {
    table#cart tbody td .form-control{  width:30%;  display: inline !important;  }
    .actions .btn{  width:36%;  margin: 0.5em 0;  }
    .actions .btn-info{  float:left;  }
    .actions .btn-danger{  float:right;  }
    table#cart thead { display: none; }
    table#cart tbody td.td_product{ text-align: left !important;}
    table#cart tbody td { display: inline-block; padding: .6rem; min-width:295px;  text-align: right !important; width: 100%;}
    table#cart tbody tr td:first-child { background:#FFF; }
    table#cart tbody td:before {  content: attr(data-th); font-weight: bold;  display: inline-block; width: 50%; text-align: left; float: left;  }
    table#cart tfoot td{display:block; }
    table#cart tfoot td .btn{display:block;}
}

@media screen and (max-width: 576px) {
    #card_code input[type="text"] {  width: auto;  }
    #card_code input[type="submit"]{ display: inline-block;}
    .btn{ width: 100%;}
    .steps{ display: none;}
    #order_recap_page .line span{ float: none; width: 100%;}
    #order_recap_page .card-block {  padding: 1em 1em;  }
    .col-header-cart a span{ display: none;}
    .form-show-actions select.form-control{ width: auto; float: left;}
    .form-show-actions input[type=number]{ width: 20%; float: left;}
    .show_product_page .btn-add-to-cart{ width: auto; float: left;}
    .form-show-actions label{ display: inline-block; width: auto; float: left;}
    .form-group-add-to-cart{ padding-top: 1em;}
    .col-infos-show{ margin-bottom: 1em;}
}

@media screen and (max-width: 480px) {
    .col-img, .col-infos{ -webkit-box-flex: 0;  -webkit-flex: 0 0 100%;  -ms-flex: 0 0 100%;  flex: 0 0 100%;  max-width: 100%;}
    .col-infos{ padding-top: 1em;}
    #card_code input[type="text"]{  margin:0;}
    #card_code input[type="text"], #card_code input[type="submit"] {  width: 100%;  }
    #card_code input[type="submit"]{ margin-top: 0.5em;}
    #navbarNav .navbar-nav li.nav-item{ width: 100%; float: none; display: block;}
    .navbar-nav{ display: block;}
    #navbarNav .btn{ width: 100%;}
    #navbarNav .btn:first-child{ margin-bottom: 1em;}
}

@media screen and (max-width: 380px) {
    #cart_page .btn-warning, #cart_page .btn-success{ width: 100%;}
    #cart_page .btn{ margin-bottom: 1em;}
    table#cart tbody td { min-width:200px; }
    .form-show-actions input, .form-show-actions select.form-control, .form-show-actions input[type=number]{ width: 100%; float: left; margin-left: 0; margin-right: 0;}
    .show_product_page .btn-add-to-cart{ width: 100%; float: left; margin-top: 1.5em;}
    .form-show-actions label{ display: inline-block; width: 100%; float: left;}
}

@media screen and (max-width: 360px) {
    .col-img{ display: none;}
    .col-infos{ padding-top: 0;}
}