.maegami-top-bg-container { width:100%; position:relative; }


.maegami-product-container { width:900px; margin:0 auto 50px auto; padding:10px 0; text-align:center;}

.maegami-product-column { width:400px; float:left; margin:20px 25px; text-align:center; }

.maegami-product-column img { max-width:360px; margin:0 auto;}

.maegami-product-column p { font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:18px; display:block; margin-bottom:10px; }


.maegami-stick-natural {border-radius:10px; padding:5px 10px; font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:16px; display:inline-block; margin-bottom:20px;  color:#000; background:yellow; border:2px solid #000; }
.maegami-stick-hard{ border-radius:10px; padding:5px 10px; font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:16px; display:inline-block; margin-bottom:20px; color:#fff; background:#000; border:2px solid yellow;  }

.maegami-title { font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:30px; font-weight:bold;  position:relative; margin:20px auto; display:inline-block; }

.maegami-title::before{
  content:"";
  width:100%;
  height:3px;
  left:0;
  bottom:-10px;
  position:absolute;
  z-index:9;
  background:linear-gradient(to right, black 50%, yellow 50%);

}


.maegami-top-info-bg-container { width:100%; background:#e4f5ff; position:relative;}


.maegami-top-info-container { width:1000px; margin:0 auto; height:auto; padding:80px 0;  }

.maegami-black-text { padding:5px; font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:24px;  }
.maegami-yellow-text { background:yellow; padding:5px;  font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:24px;  }






/* Buy Now Start */

.maegami-natural-buy {
  position: relative;
  display: inline-block;
}

.maegami-natural-buy .maegami-natural-buy-text {
  visibility: hidden;
  width: 200px;
  background-color: #ccc;
  text-align: center;
  padding: 10px 0 0 0;
  position: absolute;
  z-index: 99;
  top: 100%;
  left: 50%;
  margin-left: -100px;
  opacity: 0;
  transition: opacity 1s;
  color:#000;
  
}

.maegami-natural-buy .maegami-natural-buy-text::after {
  content: " ";
  position: absolute;
  bottom: 100%;  /* At the top of the tooltip */
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent #ccc transparent;
}

.maegami-natural-buy:hover .maegami-natural-buy-text {
  visibility: visible;
  opacity: 1;
}

.maegami-natural-buy-button { background:#fff; border:4px solid yellow; padding:5px 20px; opacity:1; color:#000; border-radius:0; display:inline-block; cursor:pointer; font-family: 'Apercu Pro', sans-serif; font-weight: normal; font-style: normal; font-size:16px; text-transform:uppercase;font-weight:bold;  }

.maegami-natural-buy-button:hover { opacity:0.8; }


.maegami-hard-buy {
  position: relative;
  display: inline-block;
}

.maegami-hard-buy .maegami-hard-buy-text {
  visibility: hidden;
  width: 200px;
  background-color: #ccc;
  text-align: center;
  padding: 10px 0 0 0;
  position: absolute;
  z-index: 99;
  top: 100%;
  left: 50%;
  margin-left: -100px;
  opacity: 0;
  transition: opacity 1s;
  color:#fff;
}

.maegami-hard-buy .maegami-hard-buy-text::after {
  content: " ";
  position: absolute;
  bottom: 100%;  /* At the top of the tooltip */
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent #ccc transparent;
}

.maegami-hard-buy:hover .maegami-hard-buy-text {
  visibility: visible;
  opacity: 1;
}

.maegami-hard-buy-button { background:#fff; border:4px solid #000; padding:5px 20px; opacity:1; color:#000; border-radius:0; display:inline-block; cursor:pointer; font-family: 'Apercu Pro', sans-serif; font-weight: normal; font-style: normal; font-size:16px; text-transform:uppercase; font-weight:bold; }

.maegami-hard-buy-button:hover { opacity:0.8; }

/* Buy Now End */

/* Usage */

.maegami-usage-bg-container { width:100%; background:#e6faff; border-top:1px solid #dcf0f9; position:relative;}

.maegami-usage-container { width:800px; padding:60px 0; margin:0 auto; text-align:center}

.maegami-usage-container span {  font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:30px; font-weight:bold; margin:20px auto 40px auto; display:block;  } 

.maegami-usage-container img { max-width:600px; margin:20px auto;}

/* 5 in 1 Benefits */

.maegami-benefits-bg-container { width:100%; background:#fffdec; border-top:1px solid #dcf0f9; position:relative;}

.maegami-benefits-container { width:1100px; padding:20px auto; margin:40px auto 0 auto; position:relative; text-align:center}

.instantly-text-spacing { margin:20px auto 40px auto; }

/* 1 */

.benefit-1-container { position:relative; width:200px; height:200px; float:left; margin-right:25px;}

.benefit-1 { clip-path: polygon(50% 1%, 100% 1%, 89% 100%, 10% 100%, 0 1%); background:#fff; width:200px; height:150px; margin:20px auto; position:relative; z-index:2; }

.benefit-1-shape { clip-path: polygon(50% 1%, 100% 1%, 89% 100%, 10% 100%, 0 1%); background:#fafba3; width:200px; height:150px; margin:20px auto; position:absolute; z-index:1; right:-10px; bottom:18px;}

.benefit-1-point { position:absolute; width:25px; height:25px; border-radius:50%; color:#fff; background:#000; padding:3px 5px 5px 6px; font-size:24px; text-align:center; top:2px; left:50%; margin-left:-17px; font-weight:bold; z-index:3;}

.benefit-1-text { position:absolute; width:180px; height:20px; border-radius:50%; padding:5px;font-size:18px; font-family: 'Apercu Pro', sans-serif;  text-align:center; top:50px; left:6px; z-index:3; }

/* 2 */

.benefit-2-container { position:relative; width:200px; height:200px; float:left; margin-right:25px;}

.benefit-2 { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#fff; width:200px; height:150px; margin:20px auto; position:relative; z-index:2; bottom:-10px; }

.benefit-2-shape { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#eff8fd; width:200px; height:150px; margin:20px auto; position:absolute; z-index:1; right:-6px; bottom:-8px;}

.benefit-2-point { position:absolute; width:25px; height:25px; border-radius:50%; color:#fff; background:#000; padding:3px 5px 5px 6px; font-size:24px; text-align:center; top:14px; left:50%; margin-left:-10px; font-weight:bold; z-index:3;}

.benefit-2-text { position:absolute; width:180px; height:20px; border-radius:50%; padding:5px;font-size:18px; font-family: 'Apercu Pro', sans-serif;  text-align:center; top:60px; left:6px; z-index:3; }

/* 3 */

.benefit-3-container { position:relative; width:200px; height:200px; margin-right:25px;float:left;}

.benefit-3 { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#fff; width:200px; height:160px; margin:20px auto; position:relative; z-index:2; bottom:-20px; }

.benefit-3-shape { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#ffbebb; width:200px; height:160px; margin:20px auto; position:absolute; z-index:1; left:-11px; bottom:-28px;}

.benefit-3-point { position:absolute; width:25px; height:25px; border-radius:50%; color:#fff; background:#000; padding:3px 5px 5px 6px; font-size:24px; text-align:center; top:26px; left:50%; margin-left:-10px; font-weight:bold; z-index:3;}

.benefit-3-text { position:absolute; width:180px; height:20px; border-radius:50%; padding:5px;font-size:18px; font-family: 'Apercu Pro', sans-serif;  text-align:center; top:70px; left:-5px; z-index:3; }

/* 4 */

.benefit-4-container { position:relative; width:200px; height:200px; float:left; margin-right:18px;}

.benefit-4 { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#fff; width:200px; height:150px; margin:20px auto; position:relative; z-index:2; top:13px; }

.benefit-4-shape { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#e3e3f2; width:200px; height:150px; margin:20px auto; position:absolute; z-index:1; left:-12px; bottom:-10px;}

.benefit-4-point { position:absolute; width:25px; height:25px; border-radius:50%; color:#fff; background:#000; padding:3px 5px 5px 6px; font-size:24px; text-align:center; top:20px; left:50%; margin-left:-10px; font-weight:bold; z-index:3;}

.benefit-4-text { position:absolute; width:180px; height:20px; border-radius:50%; padding:5px;font-size:18px; font-family: 'Apercu Pro', sans-serif;  text-align:center; top:60px; left:0; z-index:3; }

/* 5 */

.benefit-5-container { position:relative; width:200px; height:200px; float:left; }

.benefit-5 {clip-path: polygon(56% 0, 94% 0, 93% 100%, 0 100%, 19% 0); background:#fff; width:200px; height:130px; margin:20px auto; position:relative; z-index:2; }

.benefit-5-shape { clip-path: polygon(56% 0, 94% 0, 93% 100%, 0 100%, 19% 0); background:#aaf8d0; width:200px; height:130px; margin:20px auto; position:absolute; z-index:1; right:-8px; bottom:21px;}

.benefit-5-point { position:absolute; width:25px; height:25px; border-radius:50%; color:#fff; background:#000; padding:3px 5px 5px 6px; font-size:24px; text-align:center; top:4px; left:50%; margin-left:-5px; font-weight:bold; z-index:3;}

.benefit-5-text { position:absolute; width:180px; height:20px; border-radius:50%; padding:5px;font-size:18px; font-family: 'Apercu Pro', sans-serif;  text-align:center; top:40px; left:10px; z-index:3; }

/* Effortless Styling */

.effortless-styling-container { width:600px; margin:20px auto 0 auto; position:relative; text-align:center}

.effortless-styling-left-column { float:left; width:320px; margin-right:30px; }

.effortless-styling-left-column span { font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:30px; font-weight:bold; margin:60px auto 0 auto; display:block; }

.effortless-styling-right-column { float:left; width:250px;  }


.effort-less-styling-img { max-width:650px; }

/* How to use */

.how-to-use-bg-container {width:100%; position:relative; background:#f4f4f4; padding-top:40px; padding-bottom:60px; }

.how-to-use-container { width:800px; margin:0 auto; position:relative; text-align:center;}



.how-to-use-column { margin-top:20px; float:left; width:400px; text-align:center;}

.how-to-use-column img { max-width:200px; margin:0 auto 20px auto;}

.how-to-use-column p { max-width:300px; margin:0 auto; font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:18px; }

/* When to use */

.when-to-use-bg-container { width:100%; background:#e4e3f3; border-top:1px solid #dcf0f9; position:relative;}

.when-to-use-container { width:1128px; margin:40px auto 0 auto; position:relative; text-align:center; }

.when-to-use-content-container { width:1128px; margin:20px auto 0 auto; position:relative; text-align:center;}

.when-to-use-content-column-product { margin-top:20px; float:left; width:164px; text-align:center; }

.when-to-use-content-column-product p { display:block; margin:5px auto 20px auto;  font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:16px; width:140px; }

.when-to-use-content-column-left { margin-top:20px; margin-right:20px; float:left; width:250px; text-align:center; border:6px solid yellow; background:#fff;}

.when-to-use-content-column-right { margin-top:20px; float:left; width:500px; text-align:center; border:6px solid #ed659c; background:#fff; position:relative;}


.when-to-use-content-column-right-1 {  float:left; width:250px; text-align:center; }

.when-to-use-content-column-right-2 {  float:left; width:250px; text-align:center; }

.when-to-use-column-left img, .when-to-use-column-right img { max-width:200px; margin:0 auto 20px auto;}

.when-to-use-column-left, .when-to-use-column-right p { max-width:220px; margin:0 auto; font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:18px; }

.when-to-use-content-box { margin:15px; }

.natural-product { position:relative; }


/* Specially Formulated */


.specially-formulated-bg-container { width:100%; position:relative; padding-top:60px; padding-bottom:60px;}

.specially-formulated-container { width:900px; margin:0 auto; text-align:center;}

.specially-formulated { max-width:600px; margin:0 auto;}

.maegami-title-container { position:relative; width:700px; height:138px; margin:60px auto 20px auto;}

.maegami-title-left { 
    position:absolute; 
    left: 95px;
    top: 34px;
    font-family: 'Apercu Pro', sans-serif;
    font-weight: bold;
    font-size: 36px;
    line-height: 38px;
    text-transform: uppercase;
    text-align: center;
    color: #7fa328 }
    
.maegami-title-right {
        position: absolute;
    right: 85px;
    top: 34px;
    font-family: 'Apercu Pro', sans-serif;
    font-weight: bold;
    font-size: 36px;
    line-height: 38px;
    text-transform: uppercase;
    text-align: center;
    color: #c49f68;
    
}

.maegami-features-container { width:700px; margin:20px auto 0 auto; }

.maegami-features-column-left { float:left; width:180px; margin-right:20px; }

.maegami-features-column-right { float:left; width:400px; position:relative;}

.maegami-features-yellow-box { margin-left:20px; margin-bottom:20px; }

.maegami-features-pink-box { position:absolute; left:200px;}

.maegami-features-yellow-box span, .maegami-features-pink-box span { font-family: 'Apercu Pro', sans-serif; font-size:20px; font-weight:bold; }

.yellow-txt { font-family: 'Apercu Pro', sans-serif; font-size:16px; background:yellow; color:#000; padding:10px; width:300px; margin-top:5px; display:inline-block;}

.pink-txt {  font-family: 'Apercu Pro', sans-serif; font-size:16px; background:#ed659c; color:#fff; padding:10px; width:300px; margin-top:5px;  display:inline-block;}

.maegami-features-deco-1 { position:absolute; top:65px; left:15px; }
.maegami-features-deco-2 { position:absolute; top:100px; left:75px; }
.maegami-features-deco-3 { position:absolute; top:180px; left:150px; }
.maegami-features-deco-4 { position:absolute; top:10px; right:-20px; }

/* Left and Right Side Shapes */

.maegami-background-shape-left-yellow { clip-path: polygon(0 0, 0% 100%, 35% 100%); background:#fffdec; position:absolute; width:300px; height:100%; top:0; left:0; z-index:9}

.maegami-background-shape-left-purple { clip-path: polygon(0 0, 0 100%, 35% 0); background:#e4e3f3; position:absolute; width:300px; height:100%; top:0; left:0; z-index:10;}

.maegami-background-shape-right-yellow { clip-path: polygon(100% 0, 66% 100%, 100% 100%); background:#fffdec; position:absolute; width:300px; height:100%; top:0; right:0; z-index:9}

.maegami-background-shape-right-purple { clip-path: polygon(100% 0, 66% 0, 100% 100%); background:#e4e3f3; position:absolute; width:300px; height:100%; top:0; right:0; z-index:10;}

.maegami-background-shape-left-purple-full {clip-path: polygon(0 0, 0 100%, 33% 50%); background:#e4e3f3; position:absolute; width:300px; height:100%; top:0; left:0; z-index:10;}

.maegami-background-shape-right-purple-full {clip-path: polygon(100% 0, 100% 100%, 67% 50%); background:#e4e3f3; position:absolute; width:300px; height:100%; top:0; right:0; z-index:10;}

/* Lineup */

.lineup-bg-container { width:100%; background:#fff; border-top:1px solid #eeee; position:relative;}

.lineup-container { width:800px; margin:40px auto 0 auto; position:relative; text-align:center; } 

.lineup-container img { margin:0 auto; }

.product-title { 
    font-family: 'Apercu Pro', sans-serif;
    font-weight: bold;
    font-size: 20px;
    line-height: 20px;
    text-transform: uppercase;
    text-align: center; 
    margin:20px auto 5px auto;
}


.product-description { 
    font-family: 'Apercu Pro', sans-serif;
    font-size: 16px;
    line-height: 20px;
    text-transform: uppercase;
    text-align: center; 
    
}

.view-link { background:#000; padding:5px 20px; color:#fff; font-family: 'Apercu Pro', sans-serif; font-weight: normal; font-style: normal; font-size:14px; line-height:26px; margin-top:15px; transition: 0.3s; display:inline-block; text-transform:uppercase;}

.view-link:hover { padding:5px 25px; }

/* Responsive Left & Right Shape */


@media only screen and (max-width: 1200px) {
    
 .maegami-background-shape-left-yellow {  width:12%; }

.maegami-background-shape-left-purple {  width:12%; }

.maegami-background-shape-right-yellow { width:12%; }

.maegami-background-shape-right-purple {  width:12%; }

.maegami-background-shape-left-purple-full { width:12%; }

.maegami-background-shape-right-purple-full {width:12%; }


}

/* Main responsive */

@media only screen and (max-width: 1200px) {
    
.maegami-top-container {width:90%; margin:50px auto 40px auto; height:auto;  }


}

/* Top area, Product section, Usage section responsive */

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


.maegami-top-container, .maegami-top-info-container { width:90%;  }

.maegami-top-info-container { padding:60px 0;  }

.maegami-product-container { width:90%; margin:40px auto; padding:0; text-align:center;}

.maegami-product-column { width:100%; float:none; margin:20px auto; text-align:center; }

.maegami-product-column img { max-width:300px; margin:0 auto;}

.maegami-usage-container { width:90%; padding:40px 0; margin:0 auto; text-align:center}

.maegami-usage-container img { max-width:100%; }

/* Benefits section responsive */

.maegami-benefits-container { width:320px; margin:40px auto 0 auto; position:relative; text-align:center}

.benefit-1-container { position:relative; width:150px; height:200px; float:left; margin-left:5px; margin-right:5px ;}

.benefit-1 { clip-path: polygon(50% 1%, 100% 1%, 89% 100%, 10% 100%, 0 1%); background:#fff; width:150px; height:150px; margin:20px auto; position:relative; z-index:2; }

.benefit-1-shape { clip-path: polygon(50% 1%, 100% 1%, 89% 100%, 10% 100%, 0 1%); background:#fafba3; width:150px; height:150px; margin:20px auto; position:absolute; z-index:1; right:-10px; bottom:18px;}

.benefit-1-point { position:absolute; width:25px; height:25px; border-radius:50%; color:#fff; background:#000; padding:3px 5px 5px 6px; font-size:24px; text-align:center; top:2px; left:50%; margin-left:-17px; font-weight:bold; z-index:3;}

.benefit-1-text { position:absolute; width:120px; height:20px; border-radius:50%; padding:5px;font-size:16px; font-family: 'Apercu Pro', sans-serif;  text-align:center; top:50px; left:12px; z-index:3; }

.benefit-2-container { position:relative; width:150px; height:200px; float:left; margin-left:5px; margin-right:5px ; }

.benefit-2 { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#fff; width:150px; height:150px; margin:20px auto; position:relative; z-index:2; bottom:-10px; }

.benefit-2-shape { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#eff8fd; width:150px; height:150px; margin:20px auto; position:absolute; z-index:1; right:-6px; bottom:-8px;}

.benefit-2-point { position:absolute; width:25px; height:25px; border-radius:50%; color:#fff; background:#000; padding:3px 5px 5px 6px; font-size:24px; text-align:center; top:14px; left:50%; margin-left:-10px; font-weight:bold; z-index:3;}

.benefit-2-text { position:absolute; width:120px; height:20px; border-radius:50%; padding:5px;font-size:16px; font-family: 'Apercu Pro', sans-serif;  text-align:center; top:60px; left:10px; z-index:3; }

.benefit-3-container {position:relative; width:150px; height:200px; float:left; margin-left:5px; margin-right:5px ; }

.benefit-3 { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#fff; width:150px; height:160px; margin:20px auto; position:relative; z-index:2; bottom:-20px; }

.benefit-3-shape { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#ffbebb; width:150px; height:160px; margin:20px auto; position:absolute; z-index:1; left:-11px; bottom:-28px;}

.benefit-3-point { position:absolute; width:25px; height:25px; border-radius:50%; color:#fff; background:#000; padding:3px 5px 5px 6px; font-size:24px; text-align:center; top:26px; left:50%; margin-left:-10px; font-weight:bold; z-index:3;}

.benefit-3-text { position:absolute; width:120px; height:20px; border-radius:50%; padding:5px;font-size:16px; font-family: 'Apercu Pro', sans-serif;  text-align:center; top:70px; left:-3px; z-index:3; }


.benefit-4-container { position:relative; width:150px; height:200px; float:left; margin-left:5px; margin-right:5px ;}

.benefit-4 { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#fff; width:150px; height:150px; margin:20px auto; position:relative; z-index:2; top:13px; }

.benefit-4-shape { clip-path: polygon(56% 1%, 100% 0, 77% 96%, 0 97%, 16% 1%); background:#e3e3f2; width:150px; height:150px; margin:20px auto; position:absolute; z-index:1; left:-12px; bottom:-10px;}

.benefit-4-point { position:absolute; width:25px; height:25px; border-radius:50%; color:#fff; background:#000; padding:3px 5px 5px 6px; font-size:24px; text-align:center; top:20px; left:50%; margin-left:-10px; font-weight:bold; z-index:3;}

.benefit-4-text { position:absolute; width:120px; height:20px; border-radius:50%; padding:5px;font-size:16px; font-family: 'Apercu Pro', sans-serif;  text-align:center; top:60px; left:0; z-index:3; }


.benefit-5-container { position:relative; width:150px; height:200px; float:none; margin:0 auto; }

.benefit-5 {clip-path: polygon(56% 0, 94% 0, 93% 100%, 0 100%, 19% 0); background:#fff; width:150px; height:130px; margin:20px auto; position:relative; z-index:2; }

.benefit-5-shape { clip-path: polygon(56% 0, 94% 0, 93% 100%, 0 100%, 19% 0); background:#aaf8d0; width:150px; height:130px; margin:20px auto; position:absolute; z-index:1; right:-8px; bottom:21px;}

.benefit-5-point { position:absolute; width:25px; height:25px; border-radius:50%; color:#fff; background:#000; padding:3px 5px 5px 6px; font-size:24px; text-align:center; top:-12px; left:50%; margin-left:-5px; font-weight:bold; z-index:3;}

.benefit-5-text { position:absolute; width:120px; height:20px; border-radius:50%; padding:5px;font-size:16px; font-family: 'Apercu Pro', sans-serif;  text-align:center; top:32px; left:14px; z-index:3; }

/* Effortless Styling */

.effortless-styling-container { width:90%; margin:0 auto; position:relative; text-align:center}

.effortless-styling-left-column { float:left; width:100%; margin:0 auto; }

.effortless-styling-left-column span { font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:30px; font-weight:bold; margin:20px auto 0 auto; display:block; }

.effortless-styling-right-column { float:none; width:80%; margin:10px auto; }


.effort-less-styling-img { max-width:100%; }

/* How to use */


.how-to-use-bg-container {width:100%; position:relative; background:#f4f4f4; padding-top:20px; padding-bottom:40px; }

.how-to-use-container { width:90%; margin:20px auto; position:relative; text-align:center;}

.how-to-use-column { margin:20px auto; float:none; width:320px; text-align:center;}

.how-to-use-column img { max-width:150px; margin:0 auto 20px auto;}

.how-to-use-column p { max-width:300px; margin:0 auto; font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:18px; }

/* When to use */

.when-to-use-bg-container { padding-bottom:40px; }

.when-to-use-container { width:100%; margin:40px auto 0 auto; position:relative; text-align:center; }

.when-to-use-content-container { width:320px; margin:20px auto 0 auto; position:relative; text-align:center;}

.when-to-use-content-column-product { position:relative; margin:20px auto; float:none; width:240px; text-align:center; }

.when-to-use-container img  { margin:0 auto; text-align:center; }


.when-to-use-content-column-product p { display:block; margin:5px auto;  font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:16px; width:auto; }

.when-to-use-content-column-left { margin:20px auto; float:none; width:240px; text-align:center; border:6px solid yellow; background:#fff; position:relative;}

.when-to-use-content-column-right { margin:20px auto; float:none; width:240px; text-align:center; border:6px solid #ed659c; background:#fff; position:relative;}


.when-to-use-content-column-right-1 {  margin:10px auto; float:none; width:240px; text-align:center; }

.when-to-use-content-column-right-2 {  margin:10px auto; float:none; width:240px; text-align:center; }

.when-to-use-content-box img, .when-to-use-content-box img { width:120px; margin:0 auto 20px auto;}

.when-to-use-column-left, .when-to-use-column-right p { max-width:80%; margin:0 auto; font-family: 'Apercu Pro', sans-serif; text-align:center; font-size:18px; }

.when-to-use-content-box { margin:15px; }

.natural-product { position:absolute; top:-45px; right:-40px;  rotate: 20deg; width:70px; height:auto; }

.hard-product { position:absolute; top:20px; right:-40px;  rotate: -20deg; width:70px; height:auto; }

/* Specially Formulated */

.specially-formulated-bg-container { padding-bottom:160px; }

.specially-formulated-container { width:90%; margin:0 auto; text-align:center;}

.specially-formulated { max-width:100%; margin:0 auto;}

.maegami-title-container {
    
    width:100%;
    
}
.maegami-title-left { 
        
    position: relative;
        left: 0;
        top: 0;
        font-family: 'Apercu Pro', sans-serif;
        font-weight: bold;
        font-size: 32px;
        line-height: 34px;
        text-transform: uppercase;
        text-align: center;
        color: #7fa328;
        margin-bottom:10px;
}

.maegami-title-right {
        position: relative;
        right: 0;
        top: 0;
        font-family: 'Apercu Pro', sans-serif;
        font-weight: bold;
        font-size: 32px;
        line-height: 34px;
        text-transform: uppercase;
        text-align: center;
        color: #c49f68;
        margin-top:10px;
        
}

.maegami-features-container { width:320px; margin:20px auto 0 auto; max-width:320px; }

.maegami-features-column-left { float:none; width:320px; margin:20px auto; }

.maegami-features-column-right { float:none; width:320px; margin:20px auto;position:relative;}

.maegami-features-yellow-box { margin-left:0; margin-bottom:20px; }

.maegami-features-pink-box { position:absolute; left:60px;}

.maegami-features-yellow-box span, .maegami-features-pink-box span { font-family: 'Apercu Pro', sans-serif; font-size:20px; font-weight:bold; }

.yellow-txt { font-family: 'Apercu Pro', sans-serif; font-size:16px; background:yellow; color:#000; padding:10px; width:250px; margin-top:5px; display:inline-block;}

.pink-txt {  font-family: 'Apercu Pro', sans-serif; font-size:16px; background:#ed659c; color:#fff; padding:10px; width:250px; margin-top:5px;  display:inline-block;}

.maegami-features-deco-1 { position:absolute; top:85px; left:5px; }
.maegami-features-deco-2 { position:absolute; top:200px; left:40px; }
.maegami-features-deco-3 { position:absolute; top:160px; left:20px; }
.maegami-features-deco-4 { position:absolute; top:40px; right:0px; }

.maegami-yellow-text { display:inline-block;margin-top:5px;  }

/* Lineup */

.lineup-container { width:90%; } 


}