/* General */

.power-treatment-mask-background { background:url('../img/perfectbeauty/power-treatment-mask/bg.jpg'); width:100%; background-size:100%; min-height:1000px;}

.power-treatment-mask-top-container { width:1200px; margin:60px auto; }

.power-treatment-mask-top-product-img { margin-bottom:40px; }

.power-treatment-mask-top-product-container { position:relative; width:650px; margin:0 auto; padding:30px 20px; }

.power-treatment-mask-top-product-text { position:absolute; left:171px; font-family: 'Apercu Pro', sans-serif; top:80px; font-size:40px; display:block; font-weight:bold; margin-bottom:10px;}

.power-treatment-mask-top-product-container img {  width:600px; height:551px;}

.power-treatment-mask-top-product-name {  position:absolute; font-size:30px; line-height:40px; left:130px; font-family: 'Apercu Pro', sans-serif; bottom:-30px; font-weight:bold; text-align:center; }

.power-mask-desktop-responsive { display:block; }
.power-mask-mobile-responsive { display:none; }

/* Model */

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

.power-treatment-mask-model-container-left, .power-treatment-mask-model-container-right { position:relative; width:1000px; margin:0 auto; }

.power-treatment-mask-model-container-left img { width:1000px; height:679px; }
.power-treatment-mask-model-container-right img { width:1000px; height:568px; margin-left:80px;}

.power-treatment-mask-model-container-left p { font-family: 'Apercu Pro', sans-serif; position:absolute!important; font-size:30px; line-height:34px; width:400px; top:300px;  right:140px; }
.power-treatment-mask-model-container-right p { font-family: 'Apercu Pro', sans-serif; position:absolute!important; font-size:30px; line-height:34px; width:300px; top:140px;  right:-70px; }


}

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

.power-treatment-mask-model-container-left, .power-treatment-mask-model-container-right {  position:relative; width:750px; margin:0 auto; }

.power-treatment-mask-model-container-left img { width:750px; height:509px; }
.power-treatment-mask-model-container-right img { width:750px; height:426px; margin-left:60px;}

.power-treatment-mask-model-container-left p { font-family: 'Apercu Pro', sans-serif; position:absolute!important; font-size:30px; line-height:34px; width:350px; top:185px;  right:60px; }
.power-treatment-mask-model-container-right p { font-family: 'Apercu Pro', sans-serif; position:absolute!important; font-size:30px; line-height:34px; width:300px; top:140px;  right:-70px; }

    
}

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

.power-treatment-mask-model-container-left, .power-treatment-mask-model-container-right {  position:relative; width:490px; margin:0 auto; }

.power-treatment-mask-model-container-left img { width:490px; height:332px; }
.power-treatment-mask-model-container-right img { width:490px; height:278px; }

.power-treatment-mask-model-container-left p { font-family: 'Apercu Pro', sans-serif; position:absolute!important; font-size:18px; line-height:24px; width:250px; top:120px; right:20px; }
.power-treatment-mask-model-container-right p { font-family: 'Apercu Pro', sans-serif; position:absolute!important; font-size:18px; line-height:24px; width:200px; top:120px;  right:-70px; }

}

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

.power-treatment-mask-model-container-left, .power-treatment-mask-model-container-right {  position:relative; width:320px; margin:0 auto; }

.power-treatment-mask-model-container-left img { width:320px; height:217px; }
.power-treatment-mask-model-container-right img { width:320px; height:182px; }

.power-treatment-mask-model-container-left p { font-family: 'Apercu Pro', sans-serif; position:absolute!important; font-size:18px; line-height:24px; width:180px; top:50px; right:0; }
.power-treatment-mask-model-container-right p { font-family: 'Apercu Pro', sans-serif; position:absolute!important; font-size:18px; line-height:24px; width:140px; top:10px; right:auto; left:10px; }

}


.power-treatment-mask-model-container-left p, .power-treatment-mask-model-container-right p {
 color: #000;
  text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff, 1px 1px 0 #fff;

}

/* Product Title */

.power-treatment-mask-product-title-container { width:710px; margin:0 auto; }

.power-treatment-mask-product-title-text {text-align:center;  font-family: 'Apercu Pro', sans-serif; font-size:30px; margin:30px auto 0 auto; }

.power-treatment-mask-product-title-name { background:url('../img/perfectbeauty/power-treatment-mask/power-treatment-mask-title-background.webp'); margin:10px auto;   background-size: cover;
 display:block; text-align:center; font-weight:bold; height:auto; padding:10px; font-family: 'Apercu Pro', sans-serif; font-size:50px; line-height:54px; color:#000; }


@media only screen and (max-width: 768px) {
    
 .power-treatment-mask-product-title-container { width:90%; }
 .power-treatment-mask-product-title-text {text-align:center;  font-family: 'Apercu Pro', sans-serif; font-size:20px; margin:30px auto 0 auto; }
 .power-treatment-mask-product-title-name { font-size:30px; line-height:34px; }

}

/* 3D */

.power-treatment-mask-3d-container { width:1200px; margin:0 auto; position:relative; }

.power-treatment-mask-3d-column-1-img { width:700px; float:left; margin-right:50px; }

.power-treatment-mask-3d-column-1-text-container { position:relative; width:295px; height:300px; float:left;  }

.power-treatment-mask-3d-column-1-text {  z-index:10; position:absolute; width:295px; font-family: 'Apercu Pro', sans-serif; margin-top:150px; font-size:20px; line-height:24px;background:#fff; border:1px solid #564d3d; border-radius:20px; padding:25px;}
.power-treatment-mask-3d-column-1-text-box { position:absolute; bottom:-80px; right:-70px; width:345px; background:#b4b5b5; border:1px solid #564d3d; border-radius:20px; min-height:210px;}

.power-treatment-mask-3d-column-1-text span { display:block; font-family: 'Apercu Pro', sans-serif; font-size:16px; line-height:18px; margin-top:20px;}

.power-treatment-mask-3d-column-2-img { width:700px; float:left; margin-left:100px; }

.power-treatment-mask-3d-column-2-text-container { position:relative; width:295px; height:300px; float:left;  }

.power-treatment-mask-3d-column-2-text { z-index:10; position:absolute; width:295px; font-family: 'Apercu Pro', sans-serif; margin-top:150px; font-size:20px; line-height:24px; background:#fff; border:1px solid #564d3d; border-radius:20px; padding:25px;}
.power-treatment-mask-3d-column-2-text-box { position:absolute; bottom:-56px; left:-18px; width:345px; background:#b4b5b5; border:1px solid #564d3d; border-radius:20px; min-height:180px;}

.power-treatment-mask-3d-column-2-text span { display:block; font-family: 'Apercu Pro', sans-serif; font-size:16px; line-height:18px; margin-top:20px;}


.power-treatment-mask-3d-title-container { width:700px;  } 
    
.power-treatment-mask-3d-title { text-align:center; font-family: 'Apercu Pro', sans-serif; font-size:48px; line-height:50px; margin-bottom:10px; font-weight:bold; }
.power-treatment-mask-3d-subtitle { text-align:center; font-family: 'Apercu Pro', sans-serif; font-size:36px; line-height:40px; }


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

 .power-treatment-mask-3d-container { width:750px; margin:0 auto; position:relative; }

.power-treatment-mask-3d-column-1-img { width:480px; float:left; margin-right:50px; }

.power-treatment-mask-3d-column-1-text-container { position:relative; width:215px; height:300px; float:left;  }

.power-treatment-mask-3d-column-1-text {  z-index:10; position:absolute; width:215px; font-family: 'Apercu Pro', sans-serif; margin-top:100px; font-size:16px; line-height:24px;background:#fff; border:1px solid #564d3d; border-radius:20px; padding:25px;}
.power-treatment-mask-3d-column-1-text-box { position:absolute; bottom:-50px; right:-67px; width:255px; background:#b4b5b5; border:1px solid #564d3d; border-radius:20px; min-height:230px;}

.power-treatment-mask-3d-column-1-text span { display:block; font-family: 'Apercu Pro', sans-serif; font-size:16px; line-height:18px; margin-top:20px;}

.power-treatment-mask-3d-column-2-img { width:480px; float:left; margin-left:100px; }

.power-treatment-mask-3d-column-2-text-container { position:relative; width:165px; height:300px; float:left; }

.power-treatment-mask-3d-column-2-text { z-index:10; position:absolute; width:165px; font-family: 'Apercu Pro', sans-serif; margin-top:100px; font-size:16px; line-height:24px; background:#fff; border:1px solid #564d3d; border-radius:20px; padding:25px;}
.power-treatment-mask-3d-column-2-text-box { position:absolute; bottom:-45px; left:-18px; width:210px; background:#b4b5b5; border:1px solid #564d3d; border-radius:20px; min-height:223px;}

.power-treatment-mask-3d-column-2-text span { display:block; font-family: 'Apercu Pro', sans-serif; font-size:16px; line-height:18px; margin-top:20px;}

.power-treatment-mask-3d-title-container { width:530px;  } 
    
.power-treatment-mask-3d-title { text-align:center; font-family: 'Apercu Pro', sans-serif; font-size:34px; line-height:40px; margin-bottom:5px; margin-top:-20px; font-weight:bold; }
.power-treatment-mask-3d-subtitle { text-align:center; font-family: 'Apercu Pro', sans-serif; font-size:24px; line-height:30px; }
   
    
}

@media only screen and (max-width: 768px) {
 
 .power-treatment-mask-3d-container { width:100%; margin:0 auto; position:relative; }

.power-treatment-mask-3d-column-1-img { width:90%; float:none; margin:10px auto; }

.power-treatment-mask-3d-column-1-text-container { position:relative; width:295px; height:300px; float:none; margin:0 auto;  }

.power-treatment-mask-3d-column-1-text {  z-index:10; position:relative; width:245px; margin:20px auto; font-family: 'Apercu Pro', sans-serif;  font-size:16px; line-height:24px;background:#fff; border:1px solid #564d3d; border-radius:20px; padding:25px;}
.power-treatment-mask-3d-column-1-text-box { position:absolute; bottom:70px; right:-20px; width:295px; background:#b4b5b5; border:1px solid #564d3d; border-radius:20px; min-height:210px;}

.power-treatment-mask-3d-column-1-text span { display:block; font-family: 'Apercu Pro', sans-serif; font-size:16px; line-height:18px; margin-top:20px;}

.power-treatment-mask-3d-column-2-img { width:90%; float:none; margin:10px auto;; }

.power-treatment-mask-3d-column-2-text-container { position:relative; width:295px; height:300px; float:none; margin:0 auto;  }

.power-treatment-mask-3d-column-2-text {  z-index:10; position:relative; width:245px; margin:20px auto; font-family: 'Apercu Pro', sans-serif;  font-size:16px; line-height:24px;background:#fff; border:1px solid #564d3d; border-radius:20px; padding:25px;}
.power-treatment-mask-3d-column-2-text-box { position:absolute; bottom:120px; right:-20px; width:295px; background:#b4b5b5; border:1px solid #564d3d; border-radius:20px; min-height:155px;}

.power-treatment-mask-3d-column-2-text span { display:block; font-family: 'Apercu Pro', sans-serif; font-size:16px; line-height:18px; margin-top:20px;}

.power-treatment-mask-3d-title-container { width:100%;  } 
    
.power-treatment-mask-3d-title { text-align:center; font-family: 'Apercu Pro', sans-serif; font-size:34px; line-height:40px; margin-bottom:5px; margin-top:-60px; font-weight:bold; }
.power-treatment-mask-3d-subtitle { text-align:center; font-family: 'Apercu Pro', sans-serif; font-size:24px; line-height:30px; }
    
    
}


/* Product Q&A */

.power-treatment-mask-question-answer-container { width:1200px; margin:0 auto; }

.question-box { float:left; position:relative; width:800px; margin:20px auto; }
.question-box img { width:800px; height:114px; }
.question-box span { position:absolute; top:45px; left:150px; font-size:36px; color:#000; }

.answer-box { float:right; position:relative; width:800px; margin:20px auto; }
.answer-box img { width:800px; height:60px; }
.answer-box span { position:absolute; top:10px; left:100px; font-size:36px; color:#000; }

.question-box-2 { float:left; position:relative; width:800px; margin:20px auto; }
.question-box-2 img { width:800px; height:114px; }
.question-box-2 span { position:absolute; top:26px; left:160px; font-size:36px; color:#000; }

.answer-box-2 { float:right; position:relative; width:800px; margin:20px auto; }
.answer-box-2 img { width:800px; height:60px; }
.answer-box-2 span { position:absolute; top:-24px; left:110px; font-size:36px; color:#000; }

.ingredients-box { float:left; position:relative; width:800px; margin:20px auto; }
.ingredients-box img { width:800px; height:114px; }
.ingredients-box span { position:absolute; top:30px; left:90px; font-size:36px; color:#000; text-align:center;}
.ingredients-box span p { font-size:24px;  }


@media only screen and (min-width: 769px) and (max-width: 1250px) {
 
 .power-treatment-mask-question-answer-container { width:750px; margin:0 auto; }

.question-box { float:left; position:relative; width:650px; margin:20px auto; }
.question-box img { width:600px; height:86px; }
.question-box span { position:absolute; top:30px; left:115px; font-size:30px; color:#000; }

.answer-box { float:right; position:relative; width:650px; margin:20px auto; }
.answer-box img { width:600px; height:45px; }
.answer-box span { position:absolute; top:-5px; left:67px; font-size:30px; color:#000; }

.question-box-2 { float:left; position:relative; width:650px; margin:20px auto; }
.question-box-2 img { width:600px; height:86px; }
.question-box-2 span { position:absolute; top:20px; left:120px; font-size:30px; color:#000; }

.answer-box-2 { float:right; position:relative; width:650px; margin:20px auto; }
.answer-box-2 img { width:600px; height:45px; }
.answer-box-2 span { position:absolute; top:-14px; left:65px; font-size:30px; color:#000; }

.ingredients-box { float:left; position:relative; width:650px; margin:20px auto; }
.ingredients-box img { width:600px; height:86px; }
.ingredients-box span { position:absolute; top:15px; left:67px; font-size:30px; color:#000; text-align:center;}
.ingredients-box span p { font-size:24px;  }

    
}

@media only screen and (max-width: 768px) {
 
.power-treatment-mask-question-answer-container { width:100%; margin:0 auto; }

.power-treatment-mask-question-answer-container-mobile { width:320px; margin:0 auto; }

.question-box { float:left; position:relative; width:280px; margin:20px auto; }
.question-box img { width:280px; height:40px; }
.question-box span { position:absolute; top:10px; left:60px; font-size:20px; line-height:24px; color:#000; }

.answer-box { float:right; position:relative; width:280px; margin:20px auto; }
.answer-box img { width:280px; height:21px; }
.answer-box span { position:absolute; top:-5px; left:40px; font-size:20px; color:#000; }

.question-box-2 { float:left; position:relative; width:280px; margin:20px auto; }
.question-box-2 img { width:280px; height:40px; }
.question-box-2 span { position:absolute; top:10px; left:60px; font-size:20px; line-height:24px; color:#000; }

.answer-box-2 { float:right; position:relative; width:280px; margin:45px auto 20px auto; }
.answer-box-2 img { width:280px; height:21px; }
.answer-box-2 span { position:absolute; top:-5px; left:40px; font-size:20px; color:#000; }

.ingredients-box { float:left; position:relative; width:280px; margin:20px auto; }
.ingredients-box img {  width:280px; height:40px; }
.ingredients-box span { position:absolute; top:10px; left:10px; font-size:20px; line-height:24px; color:#000; text-align:center; width:300px;}
.ingredients-box span p { font-size:16px;  }

   
    
}


/* Product Box */


.product-box { position:relative; width:1200px; margin:20px auto; } 

.product-box img {  width:1200px; height:781px; } 

.product-box-text-1 { position:absolute; top:50px; left:50%; margin-left:-300px; color:#888; font-size:30px; width:600px; text-align:center;}

.product-box-text-2 { position:absolute; top:210px; left:140px; width:140px; font-size:22px; text-align:center; }

.product-box-text-3 { position:absolute; top:490px; left:45px; width:140px; font-size:22px; text-align:center; }

.product-box-text-4 { position:absolute; top:650px; left:289px; width:140px; font-size:22px; text-align:center; }

.product-box-text-5 { position:absolute; top:170px; right:138px; width:140px; font-size:22px; text-align:center; }

.product-box-text-6 { position:absolute; top:420px; right:38px; width:140px; font-size:22px; text-align:center; }

.product-box-text-7 { position:absolute; top:660px; right:278px; width:140px; font-size:22px; text-align:center; }

.move-down-weightless-text { display:none; }

.product-img-mobile { display:none; }

@media only screen and (min-width: 769px) and (max-width: 1250px) {
    
.product-box-container {  min-height:575px; }

.product-box { position:relative; width:750px; margin:20px auto; } 

.product-box img {  width:750px; height:488px; } 

.product-box-text-1 { position:absolute; top:20px; left:50%; margin-left:-225px; color:#888; font-size:24px; width:450px; text-align:center;}

.product-box-text-2 { position:absolute; top:127px; left:85px; width:90px; font-size:16px; text-align:center; }

.product-box-text-3 { position:absolute; top:300px; left:26px; width:90px; font-size:16px; text-align:center; }

.product-box-text-4 { position:absolute; top:400px; left:183px; width:90px; font-size:16px; text-align:center; }

.product-box-text-5 { position:absolute; top:105px; right:90px; width:90px; font-size:16px; text-align:center; }

.product-box-text-6 { position:absolute; top:260px; right:27px; width:90px; font-size:16px; text-align:center; }

.product-box-text-7 { position:absolute; top:400px; right:176px; width:90px; font-size:16px; text-align:center; }
    
.move-down-weightless-text { display:inline-block; }
}

@media only screen and (max-width: 768px) {
    
.product-box-container { min-height:auto; }

.product-box { display:none; } 

.product-img-mobile { display:block; margin:40px auto; width:95%; }

}


/* Ingredients */

.ingredients-img { position:relative; width:800px;  float:left;}

.ingredients-img img {  width:800px; height:299px; }

.ingredient-1 {  position:absolute; bottom:74px; left:100px; font-size:20px;  }
.ingredient-2 {  position:absolute; bottom:74px; left:275px; font-size:20px; }
.ingredient-3 {  position:absolute; bottom:74px; left:445px; font-size:20px; }
.ingredient-4 {  position:absolute; bottom:52px; left:600px;  font-size:20px; text-align:center; width:150px;}

.ingredients-illustration-container { width:1200px; min-height:500px; margin:0 auto; position:relative; }

.ingredients-illustration-left { width:370px; margin-top:100px; margin-right:60px; position:relative;}

.ingredients-illustration-left span { position:absolute; left:45px; top:-2px; font-size:26px;}

.ingredients-illustration-right { width:790px; position:absolute; top:-160px; right:0; }

.ingredients-illustration { width:900px; margin:10px auto; }

.ingredients-illustration img { width:900px; height:671px; }

.flowers-illustration { width:800px; margin:0 auto; }

.flowers-illustration img { width:800px; height:568px; }

@media only screen and (min-width: 769px) and (max-width: 1250px) {
    
.ingredients-img { position:relative; width:750px;  float:left;}

.ingredients-img img {  width:750px; height:280px; }

.ingredient-1 {  position:absolute; bottom:65px; left:100px; font-size:20px;  }
.ingredient-2 {  position:absolute; bottom:65px; left:255px; font-size:20px; }
.ingredient-3 {  position:absolute; bottom:65px; left:420px; font-size:20px; }
.ingredient-4 {  position:absolute; bottom:41px; left:560px;  font-size:20px; text-align:center; width:150px;}

    
}

@media only screen and (max-width: 768px) {
    
.ingredients-img { position:relative; width:320px; float:none; margin:40px auto 0 auto;}

.ingredients-img img {  width:320px; height:119px; }

.ingredient-1 {  position:absolute; bottom:20px; left:37px; font-size:15px;  }
.ingredient-2 {  position:absolute; bottom:20px; left:97px; font-size:15px; }
.ingredient-3 {  position:absolute; bottom:0; left:170px; font-size:15px; text-align:center; width:60px;}
.ingredient-4 {  position:absolute; bottom:0; left:230px;  font-size:15px; text-align:center; width:80px;}
    
}

@media only screen and (max-width: 1250px) {
    
.ingredients-illustration-container { width:100%; min-height:auto; margin:0 auto; position:relative; }

.ingredients-illustration-left { width:320px; margin:60px auto; position:relative;}

.ingredients-illustration-left span { position:absolute; left:45px; top:-2px; font-size:20px;}

.ingredients-illustration-right { width:90%; position:relative; top:40px; right:auto; margin:0 auto 60px auto; }

.ingredients-illustration { width:90%; margin:10px auto; }

.ingredients-illustration img { width:100%; height:auto; }

.flowers-illustration { width:90%; margin:0 auto; }

.flowers-illustration img { width:100%; height:auto; }    
    
}


/* How to use */

.how-to-use-box { float:left; position:relative; width:510px; margin:20px auto; }
.how-to-use-box img { width:510px; height:114px; }
.how-to-use-box span { position:absolute; top:34px; left:90px; font-size:36px; color:#000; }

.how-to-use-text {  width:800px; margin:20px auto; font-size:30px; text-align:center; }

.how-to-use-illustration { width:1000px; margin:0 auto; }

@media only screen and (min-width: 769px) and (max-width: 1250px) {
 
.how-to-use-box { float:left; position:relative; width:510px; margin:20px auto; }
.how-to-use-box img { width:510px; height:114px; }
.how-to-use-box span { position:absolute; top:34px; left:90px; font-size:36px; color:#000; }

.how-to-use-text {  width:750px; margin:20px auto; font-size:30px; text-align:center; }

.how-to-use-illustration { width:750px; margin:0 auto; } 
    
}

@media only screen and (max-width: 768px) {
    
.how-to-use-box { float:none; position:relative; width:100%; margin:20px auto; }
.how-to-use-box img { width:280px; height:40px; }
.how-to-use-box span { position:absolute; top:10px; left:10px; font-size:20px; line-height:24px; color:#000; text-align:center; width:300px; }

.how-to-use-text { width:90%; margin:20px auto; font-size:24px; line-height:30px; text-align:center; }

.how-to-use-illustration { width:90%; margin:0 auto; }     
    
}



/* General Responsive */

@media only screen and (max-width: 768px) {
 
 .power-treatment-mask-top-product-container { position:relative; width:320px; margin:0 auto; padding:30px 0; }

.power-treatment-mask-top-product-text { position:absolute; left:30px; font-family: 'Apercu Pro', sans-serif; top:30px; font-size:34px; display:block; font-weight:bold; margin-bottom:10px;}

.power-treatment-mask-top-product-container img {  width:320px; height:294px;}

.power-treatment-mask-top-product-name {  width:320px; position:absolute; font-size:24px; line-height:24px; left:0; font-family: 'Apercu Pro', sans-serif; bottom:-20px; font-weight:bold; text-align:center; }

.power-mask-desktop-responsive { display:none; }    

.power-mask-mobile-responsive { display:block; }
}