/*-------------------------
* GENERAL
*-------------------------*/

:root {
	--vert: #8BC34A;
	--bleu: #42A5F5;
	--gris: #F8F8F8;
}

i svg {
    width: 20px;
    height: 20px;
    margin-right: 4px;
}


body.home h2:not(.woocommerce-loop-product__title):after {
    content: url(/wp-content/themes/mobytic/assets/img/univers-veto-subtitle-paw-separator.svg);
    width: 180px;
    display: block;
    margin: 0 auto;
}

body.home h2:not(.woocommerce-loop-product__title) {
	text-align: center;
	text-transform: uppercase;
	font-weight: bold;
	margin-bottom: 35px;
}


body.home h2 strong {
	font-weight: inherit;
	color: var(--bleu);
}

body {
    overflow-x: hidden;
    max-width: 100%;
}

input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea {
    padding: 12px 10px;
}

/*-------------------------
* BUTTONS
*-------------------------*/

a.btn {
	transition: ease all 0.2s;
	padding: 6px 30px;
	border-radius: 20px;
}

a.btn:hover {
	transform: scale(0.95);
}

a.btn-blue {
	background-color: var(--bleu);
	color: white;
}

a.btn-blue:hover {
    color: var(--bleu);
    border: var(--bleu) 1px solid;
    background-color: white;
}

a.btn-green {
	background-color: var(--vert);
	color: white;
}

a.btn-green:hover {
    color: var(--vert);
    border: var(--vert) 1px solid;
    background-color: white;
}

a.btn-blanc{
	color: var(--vert);
	background-color: white;
	font-weight: bold;
	width: 100%; 
}

div.modal-content form.wpcf7-form input[type="submit"] {
    padding: 16px 30px;
    background-color: var(--bleu);
    color: white;
    font-weight: bold;
    border-color: var(--bleu);
}

div.modal-content i svg {
    font-size: 40px;
    vertical-align: middle;
    width: 40px;
    height: 40px;
}


/*-------------------------
* PREHEADER
*-------------------------*/

div.preheader {
    border-bottom: 1px solid var(--gris);
    padding: 6px 0px;
    font-size: 14px;
}

div.preheader i svg {
	width: 16px;
	height: 16px;
}

span.small {
    font-size: 10px;
    font-style: italic;
    color: var(--bleu);
}

.preheader ul {
    margin: 0 auto;
    padding: 0px;
    list-style: none;
    display: inline-block;
}

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

ul.liens-user {
    float: right;
}

li.telephone {
    color: var(--vert);
    font-weight: bold;
    margin-right: 20px;
}

li.telephone i svg {
    fill: var(--vert);
}

ul.liens-user li {
    margin-left: 12px;
}


/*-------------------------
* HEADER
*-------------------------*/

header#masthead {
    padding: 20px 0px;
}

img.logo {
    width: 280px;
}

header.site-header div.ajaxsearchpro {
    margin: 0px auto;
}

nav.main-navigation {
    background: var(--gris);
    padding: 0px;
}

ul.mega-menu ul.mega-sub-menu ul.mega-sub-menu li.widget_media_image img.image {
    object-fit: cover;
    height: 250px!important;
    float: right;
}

span.panier {
    font-weight: bold;
}

.panier-area.sticky {
    font-size: 20px;
    position: fixed;
    right: -196px;
    background-color: white;
    width: 325px;
    padding: 10px 6px;
    border: 1px solid var(--bleu);
    border-right: none;
    text-align: center;
    z-index: 999;
    top: 30px;
    transition: ease all 0.2s;
}

/* Second description for product categories */
.category-second-description-bottom {
    margin-top: 1rem;
    margin-bottom: 6rem;
}

.category-second-description-bottom > h2 {
    margin-top: 2rem;
}

.category-second-description-bottom > h2:first-of-type {
    margin-top: 0;
}

.panier-area.sticky:hover {
    right: 0px;
}

.panier-area a:first-child {
    text-decoration: none;
}



/*-------------------------
* SLIDER
*-------------------------*/

div.message {
    background-color: var(--bleu);
    color: white;
    text-align: center;
    padding: 4px;
    font-weight: bold;
}

.slider.container {
    padding: 0px;
}

/*-------------------------
* INTRODUCTION
*-------------------------*/

div.introduction {
    margin: 50px auto 80px;
}

div.introduction h1 {
    font-size: 40px;
    color: var(--bleu);
    margin: 0 auto 10px;
    font-weight: bold;
}

div.introduction h1 strong {
	font-weight: inherit;
    color: var(--vert);
}

div.introduction p {
    font-size: 25px;
    margin: 0 auto;
    line-height: 30px;
}

div.introduction a.btn {
	margin: 30px 20px 10px 0px;
}

img.veterinaires {
	height: 280px;
}

/*-------------------------
* NOS UNIVERS
*-------------------------*/
div.univers .univers-slider  {
    position: relative;
}

div.univers h2 {
	text-align: center;
	margin: 80px auto;
	position: relative;
}

div.univers >p:last-of-type {
    margin-bottom: 44px;
}

ul.liste-univers {
    padding: 0px;
    list-style: none;
    margin: 0 auto;
}

ul.liste-univers i svg {
    width: 100px;
    height: 100px;
}

ul.liste-univers li a {
	text-decoration: none;
}

ul.liste-univers li {
    border: 1px solid #efefef;
    margin: 0px 16px;
    min-height: 200px;
    padding: 20px 6px;
    transition: ease all 0.2s;
    background-color: white;
}

ul.liste-univers li:hover {
	transform: scale(0.95);
}

ul.liste-univers li h3 {
    font-size: 20px;
    font-weight: bold;
    margin: 16px auto 0px;
}

ul.liste-univers li h3 strong {
    font-weight: inherit;
    color: var(--vert);
}

div.univers h2 {
    text-transform: uppercase;
    font-weight: bold;
}

span.slick-arrow:hover {
	cursor: pointer;
}

div.univers span.prev-arrow.slick-arrow {
    position: absolute;
    left: -50px;
    top: 50%;
    transform: translateY(-50%);
}

div.univers .univers-slider {
    text-align: center;
}

div.univers span.next-arrow.slick-arrow {
    position: absolute;
    right: -50px;
    top: 50%;
    transform: translateY(-50%);
}

div.univers span.slick-arrow i svg {
    width: 40px;
    height: 40px;
    fill: #5f5f5f;
}

/*-------------------------
* NOS PRODUITS PHARES
*-------------------------*/

div.produits-phare h2 {
	text-align: center;
	margin: 80px auto 0px;
}

div.univers >p:last-of-type {
    margin-bottom: 44px;
}

div.produits-phare .nav-tabs .nav-item {
    flex: auto;
    text-align: center;
}

div.produits-phare .nav-tabs .nav-item a {
    padding: 12px 0px;
    font-size: 18px;
    font-weight: bold;
}
div.tab-content {
    background-color: var(--gris);
    padding: 50px 0px 0px;
}

div.tab-content #brand {
    padding-bottom: 50px; 
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #495057;
    background-color: var(--gris);
    border-color: var(--gris);
}

ul.nav-tabs {
    border-bottom: none;
    margin: 50px auto 0px;
}

ul.nav-tabs i svg {
    width: 28px;
    height: 28px;
    margin-right: 10px;
}


/*-------------------------
* BETWEEN REASSURANCE & BLOG
*-------------------------*/
.between-reassurance-blog {
    padding: 0px 0px;
}

.between-reassurance-blog .row {
    margin-bottom: 60px;
}

.between-reassurance-blog .row:last-child {
    margin-bottom: 0px;
}

.between-reassurance-blog img {
    object-fit: contain;
}

.between-reassurance-blog .button-cta > * {
    display: inline-flex;
    align-items: center;
    gap: 24px;
    width: 100%;
    justify-content: center;
    margin-left: 2rem;
    margin-right: 2rem;
}



/*-------------------------
* QUESTIONS
*-------------------------*/

div.question {
    padding: 50px 0px;
    background-image: url(/wp-content/themes/mobytic/assets/img/univers-veto-banniere-chat-questions.jpg);
    background-size: cover;
    background-position: center;
    color: white;
}

div.question img {
    position: absolute;
    bottom: -143px;
    left: -50px;
}

div.question h3 {
    font-weight: bold;
    font-style: italic;
    margin: 0 auto;
}

div.question p {
    font-weight: bold;
    font-size: 20px;
    margin: 0 auto;
}


/*-------------------------
* BLOG TEMOIGNAGES
*-------------------------*/

div.blog-temoignages {
	margin: 50px auto 80px;
	text-align: center;
}

div.blog-temoignages .row {
    margin-bottom: 60px;
}

div.blog-temoignages .row:last-child {
    margin-bottom: 0px;
}

.blog-img {
    min-height: 180px;
    background-size: cover;
    background-position: center;
    margin-bottom: 20px;
}

div.blog-infos h4 {
    font-size: 16px;
    font-weight: bold;
}

h4 span.post-category {
    color: var(--vert);
    text-transform: uppercase;
}

div.blog-infos {
    text-align: left;
}

/* body.home .newsletter {
    display: none;
} */

body.home div.temoignages {
    background-color: var(--bleu);
    color: white;
    margin-bottom: 12px;
    padding: 14px;
    box-shadow: 1px 3px 10px rgba(0,0,0,0.1);
}

body:not(.home) div.temoignages div.temoignages-inner {
    background-color: var(--bleu);
    color: white;
    margin-bottom: 12px;
    padding: 14px;
    box-shadow: 1px 3px 10px rgba(0,0,0,0.1);
}

.signature {
    font-weight: bold;
    margin-top: 10px;
}

div.blog-temoignages a.btn {
    margin-top: 20px;
}

.overlay-hover {
    opacity: 0;
    background-color: #42A5F5;
    height: 180px;
    transition: ease all 0.5s;
}

.blog-img:hover .overlay-hover {
    opacity: 1;
}

span.helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.overlay-hover i svg {
    width: 50px;
    height: 50px;
}


/*-------------------------
* INFOS PRATIQUES
*-------------------------*/

div.infos-pratiques {
	text-align: center;
	padding: 0px;
	margin: 50px auto;
}

div.infos-pratiques ul {
    margin: 0 auto;
    padding: 0px;
    list-style: none;
}

.grey-background {
    background-color: var(--gris);
    width: 100%;
    box-shadow: 3px 3px 6px rgba(0,0,0,0.1);
    padding: 30px;
    margin-bottom: 20px;
    transition: ease all 0.5s;
    position: relative;
}

div.infos-pratiques i svg {
    width: 80px;
    height: 80px;
}

div.infos-pratiques h4 {
	font-weight: bold;
	font-size: 18px;
	margin-top: 20px;
}

div.infos-pratiques p {
	margin: 0 auto;
}

/*-------------------------
* NEWSLETTER
*-------------------------*/

div.newsletter {
	background-image: url('/wp-content/themes/mobytic/assets/img/univers-veto-banniere-newsletter-fille-lapin-mignon.jpg');
	background-size: cover;
	background-position: center;
	margin-top: 3rem;
}

div.newsletter div.container {
	padding: 30px 15px;
	transition: ease all 0.2s;
}

div.newsletter:hover div.container{
	transform: scale(0.98);
}

div.newsletter a {
	text-decoration: none;
}

div.newsletter img {
    position: absolute;
    width: 500px;
    bottom: 0px;
}

div.newsletter p {
	margin: 0 auto;
}

div.newsletter h3 {
    font-size: 30px;
    font-weight: bold;
}

div.newsletter h3 strong {
	color: var(--vert);
	font-weight: inherit;
}


/*-------------------------
* FOOTER
*-------------------------*/

footer.site-footer {
	background-image: url('/wp-content/themes/mobytic/assets/img/univers-veto-chat-chien-couches-herbe-calin-mignon.jpg');
	background-size: cover;
	padding: 60px 0px;
	color: white;
	background-position: center;
}

footer.site-footer a {
	color: white;
}

div.copyright {
    background-color: var(--bleu);
    text-align: center;
    color: white;
    padding: 4px 0px;
}

footer.site-footer h4 {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 25px;
}

footer.site-footer ul {
    margin: 0 auto 20px;
    list-style: none;
    padding: 0px;
}

footer.site-footer div.col-xl-12 {
    text-align: center;
}

footer.site-footer div.col-xl-12 img {
    width: 500px;
    margin-top: 50px;
}

/*-------------------------
* WOOCOMMERCE
*-------------------------*/

.woocommerce ul.products li.product {
    background-color: white;
    box-shadow: 2px 2px 15px rgba(0,0,0,0.05);
    transition: ease all 0.2s;
    text-align: center;
}

.woocommerce ul.products li.product:hover {
	transform: scale(0.98);
}

h2.woocommerce-loop-product__title {
    min-height: 75px;
}

.woocommerce ul.products li.product .button {
    width: 100%;
    background-color: var(--bleu);
    color: white;
    border-radius: 0px;
    padding: 16px 0px;
}

.woocommerce ul.products li.product .woocommerce-loop-category__title, 
.woocommerce ul.products li.product .woocommerce-loop-product__title, 
.woocommerce ul.products li.product h3 {
    padding: .5em 14px;
    font-weight: bold;
}

div.category-product i svg {
    width: 25px;
    height: 25px;
}

span.product-brand {
	text-transform: uppercase;
    font-weight: bold;
    color: var(--vert);
    display: inline-block;
    margin: 14px auto 0px;
}

.woocommerce ul.products li.product .price {
    color: var(--bleu);
    font-weight: bold;
    margin-bottom: 0px;
    font-size: 20px;
}

small.woocommerce-price-suffix {
	font-size: 10px;
	color: gray;
}

ul.liste-marques {
    margin: 0 auto;
    padding: 0px;
    list-style: none;
    columns: 4;
    text-align: left;
}

ul.liste-marques{
    margin: 0 auto;
    padding: 0px;
    list-style: none;
}

.woocommerce ul.products li.product a {
    display: inline-block;
}

li.product div.overlay-hover {
    position: absolute;
    width: 100%;
    display: table;
    left: 0;
}

.woocommerce ul.products li.product a:hover div.overlay-hover {
	opacity: 1;
	background-color: rgba(66, 165, 245, 0.75)
}

span.center-me {
    display: table-cell;
    vertical-align: middle;
    color: white;
    font-weight: bold;
}

span.center-me i {
	display: block;
	margin-bottom: 10px;
}

.woocommerce ul.products li.product a img {
    width: 300px;
    height: 300px;
    object-fit: cover;
    margin: 0 auto 1em;
}

div.category-description {
    border: 1px solid lightgrey;
    padding: 10px 30px;
    margin-bottom: 30px;
}

.term-description p {
    margin: 0 auto;
}

div.category-description img {
    width: 180px;
}

.woocommerce nav.woocommerce-breadcrumb {
    text-align: center;
    margin: 20px auto 0;
    font-style: italic;
}

h1.woocommerce-products-header__title.page-title {
    text-align: center;
    margin: 0 auto 30px;
    text-transform: uppercase;
    font-size: 40px;
    font-weight: bold;
}

aside#secondary {
    background-color: var(--gris);
    padding: 16px 20px;
    box-shadow: 3px 3px 6px rgba(0,0,0,0.06);
}

div.pf-help-title h2.widget-title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 25px;
}


h1.product_title.entry-title, body.single span.product-brand {
    margin: 0 auto;
}

.woocommerce div.product p.price, .woocommerce div.product span.price {
    color: black;
    font-size: 30px;
    margin: 20px auto;
}

span.utilisation {
    font-style: italic;
}

.woocommerce .quantity .qty {
    width: 60px;
    height: 40px;
}

.woocommerce #respond input#submit.alt, 
.woocommerce a.button.alt, .woocommerce button.button.alt, 
.woocommerce input.button.alt {
    background-color: var(--bleu);
    padding: 12px 40px;
}

.woocommerce #respond input#submit.alt:hover, 
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, 
.woocommerce input.button.alt:hover {
    background-color: var(--vert);
}

span.posted_in {
    display: block;
}

.product_meta {
    background-color: var(--gris);
    padding: 8px 20px;
    color: grey;
    font-size: 12px;
}

.product_meta a {
    color: grey;
}

.woocommerce-product-gallery {
    border: 1px solid lightgrey;
}

div.product {
    margin: 50px auto;
}

a.woocommerce-product-gallery__trigger {
    display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
    padding: 0px 5px;
    margin: 0 auto;
}

.woocommerce div.product .woocommerce-tabs .panel {
    margin: 0 auto;
    padding: 20px;
    border: 1px solid lightgrey;
    border-top: 0px;
}

.woocommerce div.product .woocommerce-tabs .panel h2 {
    margin-bottom: 20px;
    font-weight: 600;
    color: var(--bleu);
    font-size: 28px;
}

section.related.products {
    margin: 80px auto 120px;
    text-align: center;
    background-color: var(--gris);
    padding: 30px 50px 0px;
    border: 1px solid lightgrey;
}

section.related.products h2 {
    margin-bottom: 40px;
    font-size: 25px;
}

section.related.products span.utilisation {
    display: none;
}

section.related.products div.category-product {
    margin: 16px auto;
}

.woocommerce ul.products li.product .star-rating {
    margin: 0 auto;
    font-size: 8px;
}

nav.woocommerce-breadcrumb:not(:last-child) {
    color: var(--bleu);
}

.woocommerce div.product .product_title {
    text-align: left;
}

@media screen and (min-width: 768px) {
    .woocommerce div.product .woocommerce-tabs ul.tabs {
        display: flex;
    }
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    flex: auto;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .woocommerce #content div.product .woocommerce-tabs ul.tabs li, .woocommerce div.product .woocommerce-tabs ul.tabs li, .woocommerce-page #content div.product .woocommerce-tabs ul.tabs li, .woocommerce-page div.product .woocommerce-tabs ul.tabs li {
       display: block;
    }
}

/*------------------------------------------
* PAGES COMPTE, CONNEXION, PANIER, CHECKOUT
*------------------------------------------*/

body.blog h1.entry-title, body.blog h2.entry-title,
body.single-post h1.entry-title, body.single-post h2.entry-title
 {
    text-align: center;
    font-weight: 600;
    background-color: var(--vert);
    color: white;
    padding: 10px;
}

h1.entry-title {
    text-align: center;
}

a.total-link {
    text-decoration: none;
}

body.blog h2.entry-title {
    font-size: 22px;
}

body.blog article.post {
    margin: 20px auto 30px;
}

body.blog article header a {
    color: white;
    text-decoration: none;
}

body.blog header.entry-header, body.single-post header.entry-header {
    min-height: 250px;
    background-position: center;
}

body.single-post h2 {
    font-size: 20px;
    font-weight: bold;
    margin: 40px auto 20px;
}

body.single-post div.entry-content p strong:nth-child(even) {
    color: var(--bleu);
}

.nav-links div a {
    border: 1px solid var(--bleu);
    color: var(--bleu);
    padding: 10px 20px;
    font-weight: bold;
    background-color: white;
    display: inline-block;
}

.nav-links {
    margin: 30px auto 100px;
}

nav.woocommerce-MyAccount-navigation ul {
    margin: 0 auto;
    padding: 0px;
    list-style: none;
}

nav.woocommerce-MyAccount-navigation ul li {
    padding: 8px 20px;
    border: 1px solid black;
    margin-top: -1px;
    transition: ease all 0.2s;
}

nav.woocommerce-MyAccount-navigation ul li a {
    display: inline-block;
    width: 100%;
    height: 100%;
    text-decoration: none;
}

nav.woocommerce-MyAccount-navigation ul li:hover {
    background-color: var(--vert);
}

nav.woocommerce-MyAccount-navigation ul li:hover a {
    color: white;
}

body.woocommerce-account div.woocommerce, body.woocommerce-cart div.woocommerce,
body.woocommerce-checkout div.woocommerce {
    margin: 0px auto 80px;
}

.woocommerce #respond input#submit, 
.woocommerce a.button, .woocommerce button.button, 
.woocommerce input.button {
    background-color: var(--vert);
    color: white;
    padding: 10px 40px;
}

.woocommerce #respond input#submit:hover, 
.woocommerce a.button:hover, .woocommerce button.button:hover, 
.woocommerce input.button:hover {
    background-color: var(--bleu);
    color: white;
}

.woocommerce .col-1, .woocommerce .col-2 { 
    max-width:none;
}

.woocommerce-account .addresses .title h3 {
    font-size: 22px;
    font-weight: 600;
    color: var(--bleu);
}

.woocommerce-account .addresses .title .edit {
    float: right;
    background-color: var(--bleu);
    color: white;
    padding: 5px 16px;
    border-radius: 20px;
    text-decoration: none;
}

fieldset {
    border: 1px solid lightgrey;
    margin: 20px auto;
    box-shadow: 3px 3px 6px rgba(0,0,0,0.05);
}

.woocommerce .woocommerce-form-login .woocommerce-form-login__submit {
    float: none;
    width: 75%;
    margin: 0 auto;
}

p.woocommerce-LostPassword.lost_password {
    font-style: italic;
    text-align: center;
    margin: 0 auto;
}

.woocommerce table.shop_table thead, tr.order-total {
    background-color: var(--gris);
    font-size: 16px;
}

form.woocommerce-cart-form {
    font-size: 14px;
    width: 70%;
    float: left;
    margin-right: 30px;
}

.woocommerce .cart-collaterals, .woocommerce-page .cart-collaterals {
    font-size: 14px;
    width: calc(30% - 30px);
    display: inline-block;
}

.woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals {
    float: none;
    width: 100%;
}

body.woocommerce-cart h2 {
    font-size: 22px;
    font-weight: 600;
    color: var(--vert);
    margin-bottom: 20px;
}

/*
* CHECKOUT STEPS
*/

.checkout-steps {
    margin: 0px auto 40px;
}

span.number {
    border: 1px solid black;
    border-radius: 50%;
    padding: 4px 8px;
    margin-right: 6px;
    font-family: sans-serif;
}

.checkout-steps ol li.active span.number {
    border-color: white;
}

.checkout-steps ol {
    padding: 0px;
    margin: 0px;
    text-align: center;
    display: flex;
    list-style: none;
}

.checkout-steps ol li {
    flex-grow: 1;
    padding: 16px 0px;
    position: relative;
    background-color:#f7f6f7;
}

.checkout-steps ol li:nth-child(2n+1) {
    background-color: #efefef;
}

.checkout-steps ol li:after {
    content: '';
    position: absolute;
    height: 100%;
    right: -30px;
    top: 0px;
    border-style: solid;
    border-width: 28px 0 28px 30px;
    border-color: transparent transparent transparent#f7f6f7;
    z-index: 9;
}

.checkout-steps ol li:nth-child(2n+1):after {
    border-color: transparent transparent transparent #efefef;
}

.checkout-steps ol li.active:after {
    border-color: transparent transparent transparent var(--bleu);
}

.checkout-steps ol li:last-child:after {
    content: '';
    position: absolute;
    height: 0px;
    width: 0px;
    right: 0px;
    top: 0px;
    border-style: solid;
    border-width: 0px;
    border-color: transparent;
}

.checkout-steps ol li img {
    width: 23px;
    margin-right: 10px;
    top: -2px;
    position: relative;
}

.checkout-steps ol li.active {
    background-color: var(--bleu);
    color: white;
}

@media screen and (min-width: 600px) and (max-width: 1000px) {
    .checkout-steps ol {
        display: block;
    }

    .checkout-steps ol li {
        display: inline-block;
        width: 50%;
    }

    .checkout-steps ol li:nth-child(2):after {
        border-style: solid;
        border-width: 0px;
        border-color: transparent;
    }
}

@media screen and (max-width: 600px) {
    .checkout-steps ol {
        display: block;
    }

    .checkout-steps ol li {
        display: inline-block;
        width: 85%;
    }
}

.woocommerce #content table.cart td.actions .input-text, 
.woocommerce table.cart td.actions .input-text, 
.woocommerce-page #content table.cart td.actions .input-text, 
.woocommerce-page table.cart td.actions .input-text {
    width: auto;
}

.woocommerce form .form-row {
    display: block;
}

div#customer_details {
    margin-bottom: 50px;
}

.woocommerce form.woocommerce-cart-form table.shop_table, body.woocommerce-checkout .woocommerce table.shop_table  {
    border-collapse: collapse;
}

.woocommerce form.woocommerce-cart-form table.shop_table td {
    border: 0.5px solid lightgrey;
}

.woocommerce-form-coupon-toggle {
    display: none;
}

div.place-order {
    text-align: center;
    font-size: 12px;
}

.woocommerce #payment #place_order, .woocommerce-page #payment #place_order {
    float: none;
    margin: 0 auto;
    font-size: 25px;
}

ul#shipping_method label {
    font-weight: 300;
}

tr.woocommerce-shipping-totals.shipping {
    background-color: var(--gris);
}

h3#ship-to-different-address {
    border: 1px solid var(--bleu);
    padding: 8px 20px;
    margin: 0 auto;
    font-size: 20px;
}

.woocommerce-checkout h3 {
    font-size: 22px;
    font-weight: 600;
    color: var(--vert);
    margin: 30px auto;
}

#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
    background: var(--gris);
    border: 1px solid lightgrey;
}

/*-------------------------
* RESPONSIF
*-------------------------*/
body.home .row {
    padding: 0px 15px;
}


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

	.container {
	    max-width: 1350px;
	}

	nav.main-navigation div#mega-menu-wrap-menu-principal ul#mega-menu-menu-principal {
		display: flex;
	}

	nav.main-navigation div#mega-menu-wrap-menu-principal ul#mega-menu-menu-principal li.mega-menu-item {
		flex: auto;
	}

}

@media screen and (min-width: 820px) and (max-width: 992px) {
    .container {
        max-width: 850px;
    }
}

@media screen and (min-width: 2000px) {
	body {
	    background-image: url(/wp-content/themes/mobytic/assets/img/univers-veto-background-paws.jpg);
	    background-repeat: repeat-y;
	    background-size: 100%;
	}
}



@media screen and (max-width: 1200px) and (min-width: 992px) {
    .produits-phare ul.products li.product {
        width: 29.5%;
    }

    .produits-phare ul.products li:last-child {
        display: none;
    }

    div.woocommerce ul.products[class*=columns-] li.product:nth-child(3) {
        margin-right: 0px;
    }
}


@media screen and (min-width: 500px) and (max-width: 992px) {
    div.woocommerce ul.products[class*=columns-] li.product:nth-child(2n), 
    .woocommerce-page ul.products[class*=columns-] li.product:nth-child(2n) {
        float: right;
        clear: none!important;
    }

    div.woocommerce ul.products[class*=columns-] li.product, 
    .woocommerce-page ul.products[class*=columns-] li.product {
        width: 48%;
        float: left;
        clear: both;
        margin: 0 0 2.992em;
    }
}

@media screen and (max-width: 500px)  {
    div.produits-phare div.woocommerce ul.products[class*=columns-] li.product {
        width: 80%;
        margin: 0 auto 50px;
        float: none;
    }

    div.introduction a.btn {
        margin: 30px auto 0px;
        font-size: 25px;
    }
}

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

    .align-right {
        text-align: center;
    }

    .hide-responsive {
        display: none;
    }

    div.question {
        margin-top: 400px;
    }

    div.question img {
        bottom: -12px;
        left: 30%;
    }

    div.tab-content {
        padding-bottom: 220px;
    }

    body {
        text-align: center;
    }

    div.blog-temoignages div.row div.col-xl-6:first-child {
        margin: 0 auto 80px;
    }

    div.newsletter img {
        position: static;
        width: 300px;
        margin-top: 20px;
    }

    ul.liens-user {
        float: none;
        margin-top: 15px;
    }

    div.question a.btn {
        max-width: 500px;
        font-size: 20px;
        margin-top: 30px;
    }

    div.blog-temoignages {
        margin: 80px auto 0px;
    }

}



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

    .woocommerce #content div.product div.images, 
    .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, 
    .woocommerce-page div.product div.images {
        width: 35%;
        margin-right: 40px;
    }

    .woocommerce #content div.product div.summary, 
    .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, 
    .woocommerce-page div.product div.summary {
        width: calc(65% - 40px);
        margin-top: 0px;
    }

    p#billing_email_field, p#billing_first_name_field, p#billing_country_field {
        width: calc(50% - 10px);
        max-width: 100%;
        margin-right: 10px;
        display: inline-block;
      }

      p#billing_city_field, 
      p#billing_state_field, 
      p#billing_phone_field,
      p#billing_email_field,
      p#shipping_city_field,
      p#shipping_state_field, 
      p#shipping_phone_field,
      p#shipping_email_field,
      p#billing_postcode_field,
      p#shipping_postcode_field
        {
          display: inline-block;
          max-width: 50%;
          width: 50%;
          vertical-align: top;
      }
}



@media screen and (max-width: 768px) {
    div.question img {
        left: 18%;
        pointer-events: none;
    }

    span.next-arrow.slick-arrow {
        right: 0px;
    }

    span.prev-arrow.slick-arrow {
        left: 0px;
    }

    header#masthead div.col-xl-6 {
        margin: 40px auto;
    }

    ul.liste-marques {
        columns: 2;
    }

    #page #content li.product {
        width: 100% !important;
        float: none !important;
    }

    div.woocommerce form .form-row {
        width: 100%;
    }

    .woocommerce div.product .product_title, .woocommerce div.product form.cart {
        max-width: 280px;
        margin: 0 auto 50px;
    }

}

@media screen and (max-width: 425px) {
    div.question img {
        left: 10%;
        width: 260px;
        bottom: 0px;
    }

    span.small {
        display: block;
    }
}