/* About Pearl Glow Skin */

.about-pearl-glow-skin { 
    background: rgb(240,224,204); 
    background: linear-gradient(180deg, rgba(240,224,204,1) 0%, rgba(255,255,255,1) 80%); 
    width:100%; 
    padding-top:120px; 
    padding-bottom:10px; 
    margin-bottom:40px; 
    animation-name: fade-in-effect;
    animation-duration: 2s;
    animation-fill-mode: forwards; 
    opacity:0;
}

.about-pearl-glow-skin-container { text-align:center; margin:0 auto; }

.about-pearl-glow-skin-container span { font-size:20px; line-height:22px; font-weight:bold; color:#64312f; display:block; }

.about-pearl-glow-skin-container p { font-size:16px; line-height:18px; }

.pearl-glow-skin-img { 
    animation-name: fade-in-effect;
    animation-duration: 2s;
    animation-fill-mode: forwards; 
    opacity:0;
    display: grid;
    grid-template-columns: 2fr 1fr;
    max-width: 800px;
    margin: auto;
    margin-bottom:60px;
}
.pearl-glow-skin-img > div{ 
    position: relative;
}
.pearl-glow-skin-img > div > div{ 
    position: absolute;
    font-size: 20px;
    font-weight: bold;
    color: #64312f;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    text-align: left;
}
.pearl-glow-skin-img > div > div > span{ 
    font-size: 25px;
    line-height: 40px;
}
@media only screen and (max-width : 680px) {
.pearl-glow-skin-img > div > div{ 
    font-size: 14px;
}
.pearl-glow-skin-img > div > div > span{ 
    font-size: 17px;
    line-height: 27px;
}
}

@media only screen and (max-width : 460px) {
.pearl-glow-skin-img { 
    grid-template-columns: 1.5fr 1fr;
}
}
@media only screen and (max-width : 400px) {
.pearl-glow-skin-img > div > div{ 
    font-size: 11px;
}
.pearl-glow-skin-img > div > div > span{ 
    font-size: 12px;
    line-height: 18px;
}
}
.natural-glow { 
    background: rgb(229,234,250);
    background: linear-gradient(90deg, rgba(229,234,250,1) 0%, rgba(255,244,230,1) 100%); 
    width:100%; 
    padding:60px 30px 0 30px;
    margin:0 auto;
    animation-name: fade-in-effect;
    animation-duration: 2s;
    animation-delay: 1s;
    animation-fill-mode: forwards; 
    opacity:0;
}

.pearl-glow-skin-content { width:600px; padding:60px 30px 30px 30px; margin:0 auto; }

.pearl-glow-skin-content p { font-size:16px; letter-spacing: -.6px;}

.pearl-glow-skin-content .animated { float:left; width:250px; margin-top:30px; margin-left:10px; margin-right:10px; }

.pearl-glow-skin-content .animated p { font-size:14px; color:#d19a5f; display:block; margin:10px 0; padding:0; }


/* Responsive */

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

.about-pearl-glow-skin { 
    padding-top:120px; 
    padding-bottom:10px; 

}

.pearl-glow-skin-img { width:90%; margin:-20px auto 60px auto; }
    
.about-pearl-glow-skin-container { text-align:center; width:100%; margin:0 auto; padding:0 20px; }

.about-pearl-glow-skin-container span { font-size:20px; line-height:22px; font-weight:bold; color:#64312f; display:block; }

.about-pearl-glow-skin-container p { font-size:16px; line-height:18px; }

.natural-glow { 

    padding:60px 30px 0 30px;
}

.pearl-glow-skin-content { width:100%; padding:60px 30px 30px 30px; margin:0 auto; }

.pearl-glow-skin-content p { font-size:16px; }

.pearl-glow-skin-content .animated { float:none; width:250px; margin:20px auto; }

.pearl-glow-skin-content .animated p { font-size:14px; color:#d19a5f; display:block; margin:10px 0; padding:0; }


}