/* Other CSS Files */

@import url("lity.min.css");
@import url("slick.min.css");

/* General */

* {
border:0;
outline:0;
}

body, html {
height: 100%;
}

body {
margin:0;
padding:0;
font-family:"Open Sans", arial;
font-size:100%;
background: #fff;
}

.clear {
clear:both;
padding:10px 0;
}

.left {
float:left;
}

.right {
float:right;
}

.centered {
text-align:center;
}

img.centered {
display:block;
margin:10px auto;
}

/* Structures */

.notfound {
width:90%;
margin:0 auto 50px auto;
}

.notfound .logo {
width:280px;
margin:50px 0 20px 0;
}

.section {
width: 100%;
clear:both;
position:relative;
margin:0;
}

.hasbg {
height:500px;
box-sizing: border-box;
padding:20px;
}

.pad {
padding:50px;
}

.w80 {
width:78%;
}

.w70 {
width:68%;
}

.w60 {
width:58%;
}

.w50 {
width:45%;
}

.w40 {
width:38%;
}

.w30 {
width:28%;
}

.w20 {
width:18%;
}

.w80 img,
.w70 img,
.w60 img,
.w50 img,
.w40 img,
.w30 img,
.w20 img {
max-width:100%;
}

/* Typography and Colors */

a {
color:#BE9B66;
text-decoration:none;
}

a:hover {
color:#4C2D26;
}

h1.centered,
h2.centered,
h3.centered {
text-align:center;
}

.heading {
text-align:center;
}

.heading h2 {
color:#795125;
display:inline-block;
width:auto;
text-transform:uppercase;
margin:20px auto;
padding:0 0 10px 0;
border-bottom:7px solid #C59A4F;
}

.button {
display:inline-block;
width:auto;
padding:10px 15px;
}

.button.transparent {
border:1px solid #BE9B66;
}

.button.waze {
border:1px solid #000;
color:#000;
background:#fff;
font-weight:bold;
}

.button.transparent:hover {
background:#BE9B66;
color:#fff;
}

.button.waze:hover {
border:1px solid #fff;
color:#fff;
background:#92C4D2;
}

.button.fb-blue {
background:#3b5998;
color:#fff;
}

.button.fb-blue:hover {
background:#8b9dc3;
color:#fff;
}

.gray {
color:#cecece;
}

.uppercase {
text-transform:uppercase;
}

.hasbg p {
font-size:80%;
line-height:1.7;
}

.orange {
background-color:rgba(255,102,0,0.7);
color:#fff;
}

.orange a {
color:#f2bb71;
font-weight:bold;
}

.orange a:hover {
color:#000;
}

/* Navigation Bar */

#navbar {
width:100%;
box-sizing: border-box;
padding:20px;
position:fixed;
top:0;
left:0;
color:#fff;
transition: all 0.5s linear;
z-index:999;
}

#navbar .name-logo {
display:inline-block;
width:210px;
float:left;
font-size:100%;
font-family:"Pacifico";
margin:0 20px 0 0px;
}

#navbar .name-logo a {
text-decoration:none;
color:#fff;
display:inline-block;
vertical-align:middle;
}

#navbar .name-logo .back-home:before {
font-family:"FontAwesome";
font-size:30px;
content:"\f104";
margin:0 10px 0 0;
}

#navbar .name-logo .back-home:hover {
color:orange;
}

#navbar .small-logo {
display:inline-block;
width:40px;
float:left;
margin:0 15px 0 -10px;
opacity:0;
transition: all 0.8s linear;
}

#navbar .small-logo img {
width:100%;
height:auto;
}

#navbar .small-logo.reveal {
opacity:1.0;
}

#navbar ul {
display:inline-block;
width:70%;
float:right;
padding:0;
margin:0;
text-align:right;
}

#navbar ul li {
list-style:none;
display:inline-block;
margin:0 20px 0 20px;
vertical-align:middle;
}

#navbar ul li a {
text-transform:uppercase;
font-size:70%;
color:#fff;
text-decoration:none;
font-weight:600;
letter-spacing: 1px;
}

#navbar ul li a:hover {
color:#E9D378;
}

#navbar.on-scroll {
padding:10px 20px;
box-shadow: 0 0 5px rgba(0,0,0,0.3) !important;
background-color:rgba(255,255,255,0.9) !important;
}

#navbar.on-scroll .name-logo,
#navbar.on-scroll ul li a {
color:#000;
}

#navbar.on-scroll .name-logo a {
color:#000;
}

#navbar.on-scroll ul li a:hover {
color:#C59A4F;
}

#navbar .togglemenu {
display:none;
width:30px;
height:25px;
background: url(../images/toggle-menu.png) no-repeat 0 0;
float:right;
cursor: pointer;
}

/* Home Section */

#home {
height: 100vh;
background: #000 url(../images/bg/bg-deco1.jpg) no-repeat top center;
background-size:cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-attachment: fixed;
}

#home .overlay {
height: 100vh;
z-index:1;
position:absolute;
opacity:0.5;
background:#000;
transition: all 0.5s linear;
}

#home .overlay.overlay-off {
opacity:0 !important;
}

#home .prev,
#home .next {
display:block;
position:absolute;
top: 50%;
transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
z-index:2;
}

#home .prev {
left:10px;
}

#home .next {
right:10px;
}

#home .prev:after,
#home .next:before{
font-family:"FontAwesome";
font-size:80px;
color:#fff;
display:inline-block;
vertical-align:middle;
}

#home .prev:after {
content:"\f104";
}


#home .next:before {
content:"\f105";
}

#home .prev:hover:after,
#home .next:hover:before {
color:#C59A4F;
}


#home .content {
position:relative;
display:block;
width:300px;
margin:auto;
text-align:center;
color:#fff;
z-index:2;
top: 50%;
transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
}

#home .logo {
position:relative;
width:100%;
height:auto;
margin:10px 0;
-webkit-filter: drop-shadow(0px 0px 2px #fff);
filter: drop-shadow(0px 0px 2px #fff);
}

#home span {
display:inline-block;
}

/* About Us Section */

#about-us {
min-height:300px;
font-size:80%;
background: #fff url(../images/bg/bg-about-us.jpg) no-repeat center center;
background-size:100%;
background-attachment: fixed;
}

#about-us h2 {
display:inline;
vertical-align:middle;
color:#cecece;
margin: 0;
font-weight:normal;
}

#about-us .en-bt,
#about-us .cn-bt {
vertical-align:middle;
}

#about-us h1 {
margin:5px 0 15px 0;
} 

#about-us p {
color:#626262;
line-height:1.7;
}

#about-us .w50.right {
text-align:center;
}

#about-us .w50.right img {
margin:40px 0;
}

#about-us .show-more-en:after,
#about-us .show-less-en:after {
font-family:"FontAwesome";
font-size:25px;
display:inline-block;
vertical-align:middle;
margin:0 0 0 5px;
}

#about-us .show-more-en:after{
content:"\f107";
}

#about-us .show-less-en:after{
content:"\f106";
}

/* What We Do section */

#what-we-do.section {
margin-bottom:-10px;
}

#what-we-do {
min-height:500px;
background: url(../images/bg/bg-facial-treatments.jpg) no-repeat top center;
background-size:cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-attachment: fixed;
}

#what-we-do .service-icons {
padding:0;
margin:20px 0 0 0;
}

#what-we-do .service-icons li {
list-style:none;
margin:0 0 20px 0;
}

/* Products Section */

#products {
background: #fff url(../images/bg/bg-products.jpg) no-repeat top center;
background-size:100%;
}

#products .animated-bg {
height: 100%;
background: url(../images/bg/bg-products-mandy.jpg) no-repeat top center;
background-size:100%;
opacity:0.0;
z-index:1;
position:absolute;
transition: all 1.0s linear;
}

#products .animated-bg.animate {
opacity:1.0;
}

#products .intro {
position:relative;
width:100%;
min-height:250px;
display:block;
padding:30px 0;
z-index:2;
}

#products .intro p {
width:50%;
display:block;
margin:15px 0 0 10%;
text-align:left;
font-size:80%;
line-height:1.7;
}

#products .footer {
position:relative;
width:100%;
height:150px;
display:block;
background: #fff url(../images/bg/bg-products-footer.jpg) no-repeat bottom center;
background-size:100%;
z-index:2;
}

#products .product-list {
position:relative;
z-index:2;
}

#products .slick-next,
#products .slick-prev {
display:block;
position:absolute;
top: 50%;
transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-o-transform: translateY(-50%);
z-index:3;
background:none;
border:none;
color:transparent;
}

#products .slick-next {
right:0;
}

#products .slick-prev {
left:0;
}

#products .slick-prev:before,
#products .slick-next:after {
font-family:"FontAwesome";
font-size:80px;
color:#E60E64;
display:inline-block;
vertical-align:middle;
}

#products .slick-prev:hover::before,
#products .slick-next:hover::after {
color:#000;
}

#products .slick-prev:before {
content:"\f104";
}


#products .slick-next:after {
content:"\f105";
}

#products .product-list {
margin:0;
padding:0;
}

#products .product-list li {
list-style-type: none;
position:relative;
width:316px;
height:357px;
display: inline-block;
cursor: pointer;
}

#products .product-list li img {
width:100%;
height:auto;
}

#products .product-caption {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width:80%;
margin:auto;
padding: 20px;
box-sizing: border-box;
font-size:80%;
color: #fff;
line-height:1.5;
background-color:rgba(204,10,88,0.7);
transform: translateY(100%);
-ms-transform: translateY(100%);
-webkit-transform: translateY(100%);
-moz-transform: translateY(100%);
-o-transform: translateY(100%);
transition: transform .35s ease-out;
-webkit-transition: -webkit-transform .35s ease-out;
-moz-transition: -moz-transform .35s ease-out;
-o-transition: -o-transform .35s ease-out;
border-radius: 40px 40px 0 0
}

#products .animate-product-caption{
transform: translateY(20%);
-ms-transform: translateY(20%);
-webkit-transform: translateY(20%);
-moz-transform: translateY(20%);
-o-transform: translateY(20%);
}

/* Updates Section */

#updates {
min-height:500px;
}

#updates .more-social {
width:40%;
margin:20px auto;
}

#updates .more-social p{
font-size:90%;
text-align:center;
margin:25px 0 15px 0;
}

/* Contact Us Section */

#contact-us-map {
height:500px;
}

#contact-us-map iframe{
position:absolute;
top:0;
left:0;
}

#contact-us-map .contactbox {
position:absolute;
top:0;
right:0;
display:block;
width:25%;
height:500px;
z-index:1;
background-color:rgba(168,111,18,0.7);
color:#fff;
font-size:90%;
padding:20px;
box-sizing: border-box;
line-height:1.7;
}

#contact-us-map .contactbox a {
color:#fff;
text-decoration:underline;
}

#contact-us-map .contactbox.hidden {
display:none !important;
}

.contactbox-ctrl {
float:right;
background-color:rgba(168,111,18,0.7);
color:#fff;
font-family:"FontAwesome";
font-size:20px;
margin:50px 0 0 0;
}

.contactbox-ctrl:before {
content:"\f107";
}

.contactbox-ctrl.close:before {
content:"\f106" !important;
}

#contact-us-map .waze {
position:absolute;
top:32%;
left:10px;
z-index:1;
font-size:80%;
box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
}

/* Footer */

#footer {
background:#795125;
min-height:100px;
overflow:auto;
}

#footer div {
display:inline-block;
font-size:80%;
color:#fff;
vertical-align:middle;
}

#footer div.left,
#footer div.right{
margin:50px 0;
padding:0 0 0 20px;
box-sizing: border-box;
}

/* Responsive */

@media screen and (min-width: 2000px) and (max-width: 2560px) {
#products .intro {
min-height:550px;
}

#products .footer {
background: #fff url(../images/bg/bg-products-footer.jpg) no-repeat top center;
}
}

@media screen and (min-width: 1440px) and (max-width: 1920px) {
#products .intro {
min-height:400px;
}

#products .footer {
background: #fff url(../images/bg/bg-products-footer.jpg) no-repeat top center;
}
}

@media screen and (max-width: 1024px) {
#navbar ul {
width:73%;
}

#navbar ul li {
margin:0 10px 0 10px;
}

#updates .more-social {
width:50%;
}

#home,
#about-us,
#what-we-do {
background-attachment: initial;
}
}

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

.clear {
display:none;
}

#navbar {
text-align:center;
}

#navbar .name-logo,
#navbar .small-logo {
float:none;
vertical-align:middle;
}

#navbar .togglemenu {
display:inline-block;
vertical-align:middle;
margin:8px 0 0 0;
}

#navbar.black {
background-color:rgba(0,0,0,0.7);
}

#navbar ul{
clear:both;
width:100%;
text-align:left;
margin:0;
padding:0;
max-height:0;
overflow-y: hidden;
transition-property: all;
transition-duration: .5s;
transition-timing-function: cubic-bezier(1, 1, 0.5, 1);
}

#navbar ul li {
display:block;
float:none;
border-bottom:1px solid gray;
padding:10px 0;
margin:0;
}

#navbar ul li:last-child {
border-bottom:0;
}


#navbar ul.active {
max-height: 355px;
overflow-y: hidden;
}

.pad {
padding:10px;
}

.w80,
.w70,
.w60,
.w50,
.w40,
.w30,
.w20 {
width:80%;
}

.left,
.right {
float:none;
margin:auto;
}

#home .content {
width:100px;
}

#home span {
font-size:9px;
}

#what-we-do .service-icons {
margin:0;
text-align:center;
}

#what-we-do,
#what-we-do .hasbg {
height:750px;
}

#what-we-do .service-icons li {
display:inline-block;
margin:0 10px 0 0;
}

#products .intro p{
width:80%;
}

#updates .more-social {
width:80%;
}

#updates .more-social .w50.left {
text-align:center;
}

#updates .more-social .w50.right {
margin-top:15px;
}

#contact-us-map .contactbox {
width:50%;
}

#fb-box {
right:25%;
}

#footer div.left,
#footer div.right{
display:block;
margin:15px auto 10px auto;
text-align:center;
}
}

@media screen and (min-width: 480px) and (max-width: 600px) {

#products .product-caption {
font-size:71%;
line-height:1.4;
}
}

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

#home .content {
width:150px;
}

#fb-box {
width:310px !important;
right:4%;
}

#contact-us-map .contactbox {
font-size:80%;
}
}

@media screen and (max-width: 320px) {
#updates .more-social {
width:90%;
}

#contact-us-map .contactbox {
font-size:75%;
}
}