html{
  scroll-behavior: smooth;
}

/*@media screen and (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}*/


/**************************/
#hero{
	width: 100vw; 
    height: 56.25vw;
	padding-bottom: 56.25%;
	position: relative;
}

video
{

    width: 100% !important;
    height: 100% !important;
}


.overlay
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fb95cc;
  mix-blend-mode: overlay;
  opacity: .5;	
}

h1 {
  font-family: 'Fredoka';
  font-weight: 700;
  font-size: 4.25em;
  color: #FFF;
}
h2 {
  font-family: 'Fredoka';
  font-weight: 800;
  font-size: 3.75em;
  color: #FFF;
}
.h2P{
	align-content: left;
	text-align: left;
	font-weight: 700;
	padding-left: 10px;
	padding-top: 15px;
}

h3 {
  font-family: 'Fredoka';
  font-weight: 700;
  font-size: 2.4em;
  color: #b705cb;
  text-transform: uppercase;	
}
@media (min-width: 768px){
  h3 {
  font-weight: 700;
  font-size: 3em;
}
}

h4 {
  font-family: 'Fredoka';
  font-weight: 700;
  font-size: 2.25em;
  color: #b705cb;
  text-transform: uppercase;
  text-align: center;
  padding-bottom: 25px;
  letter-spacing: 1px;	
}
@media (min-width:576px){
	h4 {
  font-size: 2.75em;
  padding-bottom: 25px;
  letter-spacing: 3px;	
}
}
h5 {
  font-family: 'Fredoka';
  font-weight: 700;
  font-size: 2.25em;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
  padding-bottom: 15px;
  letter-spacing: 1px;	
}

@media (min-width:576px){
	h5 {
  font-size: 2.75em;
  padding-bottom: 25px;
  letter-spacing: 3px;	
}
}
.sortTitle {
  font-family: 'Fredoka';
  font-weight: 600;
  font-size: 1.8em;
  color: #b705cb;	
  text-align: center;	
}

p {
  font-family: 'Poppins';
  font-weight: 400;
  font-size: 1em;
  color: #FFF;
  text-align: center;
}

a, a:active, a:focus, a:hover {
	text-decoration: none;
}

.brandText{
	color: #FFF;
	text-align: left;
}

.logoHolder{
	position: relative;
	height: 55px;
	top: 30px;	
	left: 20px;
}

@media (min-width: 360px){
	.logoHolder{
	height: 60px;
	top: 50px;	
	left: 20px;	
}	
}

@media (min-width: 414px){
	.logoHolder{
	height: 70px;
	top: 65px;	
	left: 20px;	
}	
}

@media (min-width: 576px){
	.logoHolder{
	height: 90px;
	top: 130px;	
	left: 20px;	
}	
}

@media (min-width: 768px){
	.logoHolder{
	height: 100px;
	top: 195px;	
	left: 75px;	
}	
}

@media (min-width: 815px){
	.logoHolder{
	height: 130px;
	top: 200px;	
	left: 60px;	
}	
}

@media (min-width: 992px){
	.logoHolder{
	height: 145px;
	top: 275px;	
	left: 60px;	
}	
}

@media (min-width: 1200px){
	.logoHolder{
	height: 160px;
	top: 450px;	
	left: 60px;	
}	
}

@media (min-width: 1444px){
	.logoHolder{
	height: 175px;
	top: 500px;	
	left: 60px;	
}	
}

.logoFDG {
  background-image: url("../../assets/img/fashion/svgs/FDG_logo.svg");
  background-position: left;
  background-repeat: no-repeat;
  background-size: contain; 
}

.socialHero
{
  position: absolute;
  bottom: -25px;
  left: -10px;	
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2.875em;
  z-index: 1;	
}
@media (min-width: 768px){
	.socialHero
{
  position: absolute;
  bottom: -15px;
  left: 30px;	
  font-size: 4em;		
}
}
@media (min-width: 992px){
	.socialHero
{
  position: absolute;
  bottom: 1px;
  left: 30px;	
  font-size: 4em;		
}
}
.socialHero li
{
  list-style: none;	
}
.socialHero li a
{
  display: inline-block;
  color: #fff !important;	
  transform: scale(0.5);
  transition: 0.5s;
  margin-left: -10px;
  	
}
.socialHero li a:hover
{
  transform: scale(0.5) translateY(-15px);
}

/******INTRo******/
#introSection {
  align-content: center;
  text-align: center;
  padding-top: 15px;	
}
@media (min-width: 768px){
#introSection {
  padding-top: 30px;	
}		
}

@media (min-width: 992px){
#introSection {
  padding-top: 50px;	
}		
}

.introText {
  font-family: 'Poppins';
  font-weight: 400;
  font-size: .95em;
  color: #b705cb;	
  padding: 20px;
}
@media (min-width: 768px){
  .introText {
  font-size: 1em;	
  padding: 10px;
}
}

.imgHolder {
  height: 150px;
  margin: 24px 0 20px 0;    
}

@media (min-width: 576px){
 .imgHolder {
  height: 240px;
}
}

@media (min-width: 768px){
 .imgHolder {
  height: 300px;
}
}

.fashionImg {
  background-image: url("../../assets/img/fashion/DF_Group.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
/******DETAIL******/
#detailSection {
  align-content: center;
  text-align: center;
  padding-top: 15px;	
}
@media (min-width: 768px){
#detailSection {
  padding-top: 30px;	
}		
}

@media (min-width: 992px){
#detailSection {
  padding-top: 50px;	
}		
}

.fashionDetail {
  background-image: url("../../assets/img/fashion/main/fashion_detail.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}
/*************BRAND SECTIONS******************/
#fashionSection {
  align-content: center;	
  background-color: #ea55ae;
  background-repeat: repeat;
  background-size: inherit;
}

#acczSection {
  align-content: center;	
  background-color: #53bbe6;
  background-repeat: repeat;
  background-size: inherit;
}

.brandSec{
	align-content: center;
	text-align: center;
	height: 200px;
}
.stripeHolder{
	height: 200px;
}
@media (min-width: 768px){
	.brandSec{
	height: 300px;
}
	.stripeHolder{
	height: 300px;
}
}

.stripeFashion {
  background-image: url("../../assets/img/fashion/main/series_stripeMB.jpg");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: contain;
}
@media (min-width: 768px){
	.stripeFashion {
  background-image: url("../../assets/img/fashion/main/series_stripe.jpg");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: contain;
}
}
.stripeAccz {
  background-image: url("../../assets/img/fashion/main/acc_stripeMB.jpg");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: contain;
}
@media (min-width: 768px){
 .stripeAccz {
  background-image: url("../../assets/img/fashion/main/acc_stripe.jpg");
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: contain;
}
}
/******DETAIL******/
#videoSection {
  align-content: center;
  text-align: center;
  padding-top: 15px;	
}
@media (min-width: 768px){
#videoSection {
  padding-top: 30px;	
}		
}

@media (min-width: 992px){
#videoSection {
  padding-top: 50px;	
}		
}

.commercialImg {
  background-image: url("../../assets/img/fashion/main/fdg_video_img.jpg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

/*************DOLL PAGE******************/


#decoraSection {
  background-color: #e73a98;
  background-image: url("../../assets/img/fashion/svgs/patternDecora.svg");
  background-repeat: repeat;
  background-size: inherit;
}

#lunaSection {
  background-color: #b248be;
  background-image: url("../../assets/img/fashion/svgs/patternLuna.svg");
  background-repeat: repeat;
  background-size: inherit;
}

#celestiaSection {
  background-color: #28a4e2;
  background-image: url("../../assets/img/fashion/svgs/patternCelestia.svg");
  background-repeat: repeat;
  background-size: inherit;
}

#sweetieSection {
  background-color: #ff8fc1;
  background-image: url("../../assets/img/fashion/svgs/patternSweetie.svg");
  background-repeat: repeat;
  background-size: inherit;
}



.fashionDiv {
  height: 360px;	
  align-content: center;
   padding: 10px 15px 15px 15px;
} 
.fashionHolder {
  align-content: center;
  height: 210px;
  margin: 5px;	
}
.panelText {
  color: #b705cb;	
  font-size: 12px;
  font-weight: 400;
  line-height: 1.1;		
  padding: 10px 5px 15px 5px;
  margin: 0 10px;
}
@media (min-width: 360px){
  .fashionDiv {
  height: 420px;	
  padding: 0px 15px 15px 15px;
} 
  .fashionHolder {
  height: 280px;
  margin: 10px;		  
} 
.panelText {
  font-size: 15px;
  line-height: 1.1;	
  padding: 10px 5px 15px 5px;
  margin: 0 5px;
}	
}
@media (min-width: 414px){
  .fashionDiv {
  height: 475px;	
  padding: 0px 15px 15px 15px;
} 
  .fashionHolder {
  height: 320px;
  margin: 10px;		  
} 
.panelText {
  font-size: 15px;
  line-height: 1.1;	
  padding: 10px 5px 15px 5px;
  margin: 0 5px;
}	
}
@media (min-width: 576px){
  .fashionDiv {
  height: 550px;	
  padding: 35px 15px;
} 
  .fashionHolder {
  height: 345px;
  margin: 10px;		  
} 
.panelText {
  font-size: 15px;
  line-height: 1.1;	
  padding: 10px 5px 15px 5px;
  margin: 0 5px;
} 	
}
@media (min-width: 768px){
  .fashionDiv {
  height: 440px;	
  padding: 35px 15px;
} 
  .fashionHolder {
  height: 345px;
  margin: 10px;		  
}
.panelText {
  font-size: 10.5px;
  line-height: 1.1;	
  padding: 265px 5px 15px 5px;
  margin: 0 5px;
}  	
}
@media (min-width: 818px){
  .fashionDiv {
  height: 490px;	
  padding: 50px 15px;
} 
  .fashionHolder {
  height: 360px;
  margin: 10px;		  
}
.panelText {
  font-size: 10.5px;
  line-height: 1.1;	
  padding: 275px 5px 15px 5px;
  margin: 0 5px;
}  	
}
@media (min-width: 992px){
  .fashionDiv {
  height: 620px;	
  padding: 50px 15px;
} 
  .fashionHolder {
  height: 500px;
  margin: 0px;		  
}
.panelText {
  font-size: 14px;
  line-height: 1.1;	
  padding: 390px 10px 15px 12px;
  margin: 0 10px;
}  	
}

@media (min-width: 1200px){
  .fashionDiv {
  height: 650px;	
  padding: 50px 15px;
} 
  .fashionHolder {
  height: 530px;
}
.panelText {
  font-size: 14.5px;
  padding: 420px 20px 15px 20px;
  margin: 0 10px 0 15px;
}	
}

.sidePanel{
	background-color:#fff;
	height: 100px;
	border: 2.5px solid;
	border-radius: 8px;
	margin: 10px 5px 20px 5px;
	
}
@media (min-width: 360px){
	.sidePanel{
	height: 100px;
	border: 2.5px solid;
	margin: -20px 10px 20px 10px;	
}
}
@media (min-width: 414px){
	.sidePanel{
	height: 100px;
	border: 2.5px solid;
	margin: -5px 10px 20px 10px;	
}
}
@media (min-width: 576px){
	.sidePanel{
	height: 100px;
	border: 3px solid;
	margin: 10px 10px 20px 10px;	
}
}
.sidePurple{
	border-color: #600096;
}
.sideTeal{
	border-color: #00ede5;
}
.sideYellow{
	border-color: #fae80c;
}
.decora1 {
  background-image: url("../../assets/img/fashion/panels/d1.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.decora2 {
  background-image: url("../../assets/img/fashion/panels/d2.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.decora3 {
  background-image: url("../../assets/img/fashion/panels/d3ALT.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
@media (min-width: 768px){
  .decora3 {
  background-image: url("../../assets/img/fashion/panels/d3.png");
}
}

.decora4 {
  background-image: url("../../assets/img/fashion/panels/d4.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.luna1 {
  background-image: url("../../assets/img/fashion/panels/l1.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.luna2 {
  background-image: url("../../assets/img/fashion/panels/l2.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.luna3 {
  background-image: url("../../assets/img/fashion/panels/l3ALT.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
@media (min-width: 768px){
  .luna3 {
  background-image: url("../../assets/img/fashion/panels/l3.png");
}
}
.luna4 {
  background-image: url("../../assets/img/fashion/panels/l4.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.celestia1 {
  background-image: url("../../assets/img/fashion/panels/c1.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.celestia2 {
  background-image: url("../../assets/img/fashion/panels/c2.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.celestia3 {
  background-image: url("../../assets/img/fashion/panels/c3ALT.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
@media (min-width: 768px){
  .celestia3 {
  background-image: url("../../assets/img/fashion/panels/c3.png");
}
}
.celestia4 {
  background-image: url("../../assets/img/fashion/panels/c4.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.sweetie1 {
  background-image: url("../../assets/img/fashion/panels/s1.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.sweetie2 {
  background-image: url("../../assets/img/fashion/panels/s2.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.sweetie3 {
  background-image: url("../../assets/img/fashion/panels/s3ALT.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
@media (min-width: 768px){
  .sweetie3 {
  background-image: url("../../assets/img/fashion/panels/s3.png");
}
}
.sweetie4 {
  background-image: url("../../assets/img/fashion/panels/s4.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/**********SOON****************/

#soonSection{
	align-content: center;
	padding: 25px 0 25px 0;
}

.pageText {
  font-family: 'Poppins';
  font-weight: 400;
  font-size: .95em;
	text-align: center;
  color: #b705cb;	
  padding: 20px;
}
@media (min-width: 768px){
  .pageText {
  font-size: 1em;	
  padding: 10px;
}
}

.soonHolder{
	height: 200px;
	padding: 25px;
}

.fpSlumber {
  background-image: url("../../assets/img/fashion/soon/SLUMBER.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.fpProm {
  background-image: url("../../assets/img/fashion/soon/PROM.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.fpLocker {
  background-image: url("../../assets/img/fashion/soon/LOCKER.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/***********BUY******************/
#buySection{
	align-content: center;
	padding: 50px 0 70px 0;
}

.retailHolder{
	height: 100px;
	padding: 25px 0 50px 0;
	margin: 25px 0 50px 0;
}

@media (min-width:768px){
	.retailHolder{
	height: 250px;
	padding: 5px;
	margin: 5px 0 0 0;	
}
}

.retailAmz {
  background-image: url("../../assets/img/logos/amz_logo.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.retailTag {
  background-image: url("../../assets/img/logos/target_logo.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.retailWm {
  background-image: url("../../assets/img/logos/wm_logo.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.retailFAO {
  background-image: url("../../assets/img/logos/fao_logo.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}


/*************down*****************/

#actSection{
	background-color: #34c3e6;
	align-content: center;
	padding: 25px 0 25px 0;
}

.actHolder{
	height: 240px;
	padding: 25px;
}

@media (min-width: 768px){
	.actHolder{
	height: 300px;
	padding: 25px;
}
}
.act01 {
  background-image: url("../../assets/img/fashion/svgs/silhouette_decora.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.act02 {
  background-image: url("../../assets/img/fashion/svgs/silhouette_luna.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.act03 {
  background-image: url("../../assets/img/fashion/svgs/silhouette_celestia.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.act04 {
  background-image: url("../../assets/img/fashion/svgs/silhouette_sweetie.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.thumbTitle {
	font-family: 'Fredoka';
	font-size: 15px;
	font-weight: 600;
    line-height: 1.1;
	letter-spacing: 1px;
	color: #fff;
	text-transform: uppercase;
	padding-top: 10px;
	padding-bottom: 15px;
	text-align: center !important;	
}

@media (min-width: 414px){
	.thumbTitle {
	font-size: 15px;	
	padding-top: 10px;	
}
}

@media (min-width: 768px){
	.thumbTitle {
	font-size: 16px;	
	padding-top: 10px;
}
}
@media (min-width: 992px){
	.thumbTitle {
	font-size: 18px;	
	padding-top: 10px;
}
}
/************series1********************/
#seriesHero{
	align-content: center;
	background-color: #ef00ae;
	background-image: url("../../assets/img/fashion/series/series_bannerMB.jpg");
	background-repeat: no-repeat;
	background-position: top;
	background-size: contain;
	height: 120px;
}
@media (min-width: 576px){
	#serieszHero{
	background-image: url("../../assets/img/fashion/series/series_banner.jpg");	
	height: 155px;
}
}
@media (min-width: 768px){
	#seriesHero{
	height: 180px;
}
}
@media (min-width: 992px){
	#seriesHero{
	height: 250px;
}
}

/****************ACC**********************/
#acczHero{
	align-content: center;
	background-color: #f17bff;
	background-image: url("../../assets/img/fashion/accessories/acc_bannerMB.jpg");
	background-repeat: no-repeat;
	background-position: top;
	background-size: contain;
	height: 120px;
}
@media (min-width: 576px){
	#acczHero{
	background-image: url("../../assets/img/fashion/accessories/acc_banner.jpg");	
	height: 155px;
}
}
@media (min-width: 768px){
	#acczHero{
	height: 180px;
}
}
@media (min-width: 992px){
	#acczHero{
	height: 250px;
}
}

.padPlus{
	margin: 25px;
}

@media (min-width: 768px){
	.padPlus{
	margin: 50px;
}
}