/**
DressCodes SnowConcept Accueil
 */

/*** Bannière ****/ 

/* Layout responsive */ 
.banniere-shop .sc-lien-texte:after {
	color: #ffffff;
}

.mgz-single-image-wrapper {
	display: block;
}

/* Animation Neige */
.bloc-snow-fall {
	position: absolute;
    top: 0;
    display: flex;
    bottom: 0;
    width: 100%;
}

.snow-wrap {
	width: 100%;
	position: relative;
	overflow: hidden;
}

.snow, .snow:after, .snow:before {
	position: absolute;
	top: -650px;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: 
	radial-gradient(4px 4px at 100px 50px, #fff, transparent),
	radial-gradient(6px 6px at 200px 150px, #fff, transparent),
	radial-gradient(3px 3px at 300px 250px, #fff, transparent),
	radial-gradient(4px 4px at 400px 350px, #fff, transparent),
	radial-gradient(6px 6px at 500px 100px, #fff, transparent),
	radial-gradient(3px 3px at 50px 200px, #fff, transparent),
	radial-gradient(4px 4px at 150px 300px, #fff, transparent),
	radial-gradient(6px 6px at 250px 400px, #fff, transparent),
	radial-gradient(3px 3px at 350px 500px, #fff, transparent);
	background-size: 650px 650px;
	animation: snowAnim 3s linear;
	animation-iteration-count: infinite;
}
.snow:after {
	margin-left: -250px ;
	opacity: 0.5;
	filter: blur(2px);
	animation-direction: reverse;
	animation-duration: 6s;
}

.snow:before {
	margin-left: -350px ;
	opacity: 0.7;
	filter: blur(1px);
	animation-direction: reverse;
	animation-duration: 9s;
}

@keyframes snowAnim {
	from{
		transform: translateY(0);
	}
	to{
		transform: translateY(650px);
	}
}

.sc-contenu-banniere {
	position: relative;
	z-index: 2;
	padding: 40px;
}

@media (max-width: 768px) {
	.sc-contenu-banniere { padding: 30px;} 
} 

/* Global */ 
h1 { font-size:28px }

@media screen and (min-width: 769px) {
    h1 { margin-bottom: 0; }
}
	
@media screen and (max-width: 768px) {
    h1 { font-size:20px }

    h2 { font-size: 18px; }

    div[data-content-type='text'] { 
    	padding-left: 20px;
    	padding-right: 20px;
    }
}

/* Section catégorie */ 


#images-categorie .image-content {
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
	padding-top: 20px;
}

/* catégorie marque */ 
#section-categorie-marque .mgz-single-image-wrapper .image-content {
	height: 100%;
}

/* reassurance */ 
#reassurance-accueil .mgz-single-image-wrapper {
	padding: 10px 20px;
	background-color: rgba(255, 255, 255, .4);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}

/* Bloc marque */
.sc-logos-marque {
	padding: 40px 0;
}

.sc-logos-marque .logo-marque {
	position: relative;
	transition: all 0.25s;
}

.sc-logos-marque .logo-marque img {
	padding: 40px 0;
	position: relative;
	z-index: 2;
	transition: all 0.25s;
}

.sc-logos-marque .logo-marque:before {
	content: '';
	display: block;
	position: absolute;
	width: 100%;
	height: 0;
	top:0;
	left: 0;
	background-color:var(--orange);
	transition: all 0.25s;
}

.sc-logos-marque .logo-marque:hover img {
	    filter: invert(100%);
	     -webkit-filter: invert(100%);
}

.sc-logos-marque .logo-marque:hover:before { height: 100%; }

@media (max-width: 992px) {
	.sc-logos-marque  .mgz-element-inner {
		border: none;
	} 
}


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

    /* Bloc marque */
    .sc-logos-marques .pagebuilder-column-line { justify-content: center; }
    
    .sc-logos-marques .pagebuilder-column { flex-basis: 33%; }

}

/* Conseils */ 
.bloc-conseil {
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.05);
	transition: all 0.25s;
}

.bloc-conseil:hover {
	box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.250);
}

@media (max-width: 1200px) {
	#blocs-conseils .mgz-cta {
		flex-direction: column;
	}

	#blocs-conseils .mgz-cta .mgz-cta-content {
		min-height: 300px;
	}
}

@media screen and (max-width: 992px) {
    #blocs-conseils .css-mobile-slider > .inner-content {
     align-items: center;

    }
}


