@charset "UTF-8";
/* 

Eminence Beauty | CSS Document 


Author : FOX DESIGN creative
URL: www.foxdesign.com.au

*/


/*----------------------------------------------------------------------------- 
Global Styles
-----------------------------------------------------------------------------*/
html,body,div,dl,dt,dd,pre,form,fieldset,input,textarea,blockquote { 
	margin:0; 
	padding:0; 
}

html { 
	margin:0; 
	padding:0; 
	overflow: -moz-scrollbars-vertical;
}


/* Perfect Full Page Background Image*/
html { 
  background: none; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
}
 
body,td,th,p,li { font-size:1em; line-height:1.5em; color:#7f7f7f; font-family: "Times New Roman", Times, serif;}
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	z-index:1;
	
}

/* set image max width to 100% */
img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

a { text-decoration:none; color: #696969;}
a:hover { color: #4e5961; text-decoration:underline; }

h1 { font-size:34px; line-height:35px; font-weight:normal; color: #4e5961; padding:0px 0px 10px 0px; margin:0px; text-align:left; text-transform:uppercase;}
h1 a{ color:#706395; text-decoration:none;  }
h1 a:hover{ color:#972883; text-decoration: underline;}

h2 {font-size:26px; line-height:26px; color: #4e5961; padding: 7px 0; margin:0px; text-transform: uppercase; text-align:left; font-weight: normal;}
h2 a{ color:#4e5961; text-decoration:none;}

h3 {font-size:28px; line-height:35px;  color: #4e5961;  padding:0px 0px 10px 0px;  margin:0px; margin-top:30px; text-align:left; font-weight:normal;text-transform:uppercase; }

h4 {font:14px/26px; color: #4e5961; padding: 0px; margin:0px; text-align:left;}
 

 
@media screen and (max-width: 768px) {
h1 {text-align:center;  }
}


fieldset { 	border: 0; }

.clear {
	clear: both;
	font-size: 0;
	height: 0;
	line-height: 0;
	font-family: Verdana, Geneva, sans-serif;
}
a img{ border:none;}
hr {color: #999; background-color:#999; height:1px; border:none; }

p{padding:4px 0px 4px 0px; margin:0;color:#999;}

b{ color:#333;}

.wrap_general{float: left; width: 100%; height: auto;}

/* end of global
--------------------------------------------------------------------------------------------------*/
#wrap-out{ float:left; width:100%; height:100px;  min-height:100px;  }
html>body #wrap-out{height:auto;}
#wrap{ margin:0 auto; padding: 0 25px 25px 25px; max-width:980px; height:100px; min-height:100px; }
html>body #wrap{height:auto;}
/*----------------------------------------------------------------------------- 
left
-----------------------------------------------------------------------------*/
#left_wrap{ float:left; width:27.5%; height:100px; min-height:100px; background: #fff;}
html>body #left_wrap{height:auto;}
#logo_wrap{ float:left; padding: 42px 0; width:100%; height:auto; }
#nav_wrap{ float:left; width:100%; height:20px; min-height:20px;  }
html>body #nav_wrap{height:auto;}

@media screen and (max-width: 768px) {
    #left_wrap{ width:100%; }
    #logo_wrap{ float:left; padding: 22px 0 0 0; width:100%; height:auto;  text-align: center;}
    #logo_wrap img{width: 50%}
    #nav_wrap{ width:100%; height:0;  }
}
 
/* main left_ main nav */
#main-nav{ float:left; width:268px; height: auto;}
#main-nav ul{ float:left; width:268px; height:auto; list-style: none;}
#main-nav li{ float:left; width:268px; height:auto; list-style:none; margin:0px; padding:0px;}
#main-nav li a{display:block; font-size:0.8em; line-height:34px; padding-left:15px;  color:#a7a7a7; height:34px; margin-bottom:4px; text-decoration:none;  text-transform:uppercase; font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"; font-weight: normal;}
#main-nav li a:hover{text-decoration:none;  color:#4e5961; }
#main-nav li.selected{display:block;  height:34px; text-decoration:none; margin-bottom:4px;  }
#main-nav li.selected a{display:block; padding-left:15px; color:#4e5961; height:34px; margin-bottom:4px; text-decoration:none; }
#main-nav li.selected a:hover{display:block; text-decoration:none;color:#4e5961; }

/*----------------------------------------------------------------------------- 
right
-----------------------------------------------------------------------------*/
#right_wrap{ float:right; width:69%; height:100px; min-height:100px;}
html>body #right_wrap{height:auto;}
@media screen and (max-width: 768px) {
    #right_wrap{ float:left; width:100%; }
}

#homeslide_wrap{ float:left; width:100%; height:auto; margin-bottom:25px; }
 
 /*-main conent-*/
 #main-content_wrap{ float:left; padding:45px 0;  width:100%; height:50px; min-height:50px;  }
 html>body #main-content_wrap{height:auto;}
 #main-content{float:left; width:100%; height:20px; min-height:20px;  background:#fff; margin-bottom: 20px;} 
 html>body #main-content{height:auto;}

#main-content p{font-size: 1em; color: #4e5961; line-height: 30px; font-family:  'Helvetica Neue', Helvetica, Arial, Gotham,'sans-serif';}


 #main-content-bottom{ float:left; width:100%; height:auto; padding: 2em 0;  }
.social_left{float: left; width:70%; height: auto; }
 .social_right{float: right; width:28%; height: auto; }

@media screen and (max-width: 768px) {
 #main-content_wrap{  padding:25px 0 0 0;  }
 .social_left{float: left; width:100%; }
 .social_right{float: right; width:100%; text-align: center}
  .social_right h2{  text-align: center}  
}

/*-home page-*/
.slideshow_wrap-out{float:left; width: 100%; height: auto; padding: 30px;}


#home-short-cut{ float:left; width:679px; height:126px;}
#home-facebook{ float:left; width:216px; height:126px; padding-right:15px}
#home-gift{ float:right; width:216px; height:126px;}

/*-------- footer --------*/
#footer_wrap-out{ float:left; width:100%; height:auto; }
#footer_wrap{ margin:0 auto; max-width:980px; height:auto;}
 
#footer-logo{ float:left; width:23%; height:auto; text-align:center;   border-right: 1px solid #e5e5e5; padding: 55px 2% 20px 2%;}
#footer{ float:left; width: 45%; height:auto; padding:20px 10px 0px 20px; border-right: 1px solid #e5e5e5; }

#footer_right{float:right; width: 20%; height:auto; padding:25px 0px 0px 0px; }
.footer{ font-size:14px; color:#666;}
.footer a { color:#666; text-decoration:none; line-height:20px;}
.footer a:hover{color: #4e5961; text-decoration:underline}

 
@media screen and (max-width: 768px) {
#footer-logo{ padding:0 0 0 30%;  width:40%; height:auto; text-align:center;   border-right: none; }
#footer{width: 100%; height:auto; padding:20px 0px 0px 0px;  border-right: none; text-align: center;}
#footer_right{float:right; width: 100%; height:auto; padding:25px 0px 0px 0px; text-align: center;}
}
 
/*--------inner page--------*/
/*-left|inner page-*/
#social-media_left{ float:left; width:268px; height:156px; margin-top:15px;}
.social-media{ float:left; width:40px; height:40px; margin:5px;}
.social-media:hover img {
  filter: grayscale(100%);
}
 
@media screen and (max-width: 768px) {
.social-media{ float:none; width:40px; height:40px; margin:0 auto; }
}


/*-main part |inner page-*/
#inner-cover{ float:left; width:679px; height:278px; margin-bottom:25px;}
#inner-title{ float: left; width:100%; min-height:35px; margin-bottom:10px;}
#inner-subtitle{ float:left; width:100%; min-height:40px;  margin-bottom:10px; margin-top:20px;  padding-top: 20px;  border-top: 1px solid #6c6c6c;}
.inner-subtitle{ float:left; width:100%; min-height:40px;  margin:20px 0;   padding-top: 26px;  border-top: 1px solid #cacaca;  }
#inner-gift-title{ float:left; width:614px; height:40px;   margin-top:20px; padding-left:15px;}

.raw{float:left; width: 100%; height: auto;}
.raw_left{float:left; width: 46%; height: auto;}
.raw_right{float:right; width: 46%; height: auto;}


.inner_raw{ float:left; width:100%; height:20px; min-height:20px; margin-bottom:1.5em;  color:#4e5961; font-size: 1em; text-transform: uppercase;}
html>body .inner_raw{ height:auto}

.inner_raw-left{ float:left; width:75%; height:20px; min-height:20px; line-height: 1em; padding: 0.5em 0; }
html>body .inner_raw-left{ height:auto}

.inner_raw-right{ float:right; width:25%; height:20px; min-height:20px; text-align:right; }
html>body .inner_raw-right{ height:auto}


.skin_raw-left{ float:left; width:50%; height:20px; min-height:20px; line-height: 1em; padding: 0.5em 0; }
html>body .skin_raw-left{ height:auto}

.skin_raw-right{ float:right; width:50%; height:20px; min-height:20px; text-align:right; }
html>body .skin_raw-right{ height:auto}



.inner_raw2{ float:left; width:100%; height:20px; min-height:20px;  color:#4e5961; font-size: 1em; text-transform: uppercase;}
html>body .inner_raw2{ height:auto}


#inner_raw3{ float:left; width:100%; height:20px; min-height:20px; margin-top:12px;  color:#4e5961;}
html>body #inner_raw3{ height:auto}
#inner_raw-left3{ float:left; width:470px; height:20px; min-height:20px;  font-size:15px; line-height:26px; padding:10px 0px 10px 0px; }
html>body #inner_raw-left3{ height:auto}

#inner_raw-right3{ float:right; width:100px; height:20px; min-height:20px; text-align:right;  font-size:15px;line-height:26px;padding:10px 0px 10px 0px; color:#333}
html>body #inner_raw-right3{ height:auto}

.inner_raw3{ float:left; width:100%; height:20px; min-height:20px; margin-top:12px;  color:#4e5961; font-size: 1.2em;}
html>body .inner_raw3{ height:auto}
.inner_raw-left3{ float:left; width:470px; height:20px; min-height:10px;  line-height:26px; padding:10px 0px 01px 0px;  }
html>body .inner_raw-left3{ height:auto}

.inner_raw-right3{ float:right; width:100px; height:20px; min-height:20px; text-align:right;  line-height:26px;padding:10px 0px 10px 0px;  }
html>body .inner_raw-right3{ height:auto}

.inner_raw-left4{ float:left; width:12%; height:26px; min-height:26px;}
html>body .inner_raw-left4{ height:auto}
.inner_raw-left5{ float:left; width:88%; height:26px; min-height:26px;}
html>body .inner_raw-left5{ height:auto}

#inner_raw4{ float:left; width:599px; height:20px; min-height:20px;  padding:0px 15px;  color:#4e5961;}
html>body #inner_raw4{ height:auto}
 
@media screen and (max-width: 768px) {
.inner_raw-left4{  width:25%;  }
.inner_raw-left5{  width:75%; }
    
.skin_raw-left{ float:left; width:100%; padding: 0.5em 0 0 0;  }
.skin_raw-right{ float:right; width:100%; } 
    
}


.inner_raw-notice{ float:left; width:95%; height:11px; min-height:11px; margin-bottom:30px; line-height:18px; color:#8b8b8b; font-size: 11px; font-family: "Helvetica Neue", Helvetica, Arial,  Gotham,"sans-serif"}
html>body .inner_raw-notice{ height:auto}




/* Slide images */
.slides {
    display: none;
}

.slides img {
    width: 100%;
    height: auto;
}

/* Fade animation */
.fade {
    animation-name: fadeEffect;
    animation-duration: 1.0s;
}

@keyframes fadeEffect {
    from { opacity: 0.4; }
    to { opacity: 1; }
}

/* Number Icons at the bottom right */
.number-icons {
    position: absolute;
    bottom: 20px;
    right: 20px;
    display: flex;
    gap: 10px;
}

.icon {
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 10px;
    border-radius: 50%;
    cursor: pointer;
    transition: background-color 0.3s ease;
    font-size: 12px; line-height: 10px; width: 10px; text-align: center;
}

.icon:hover {
    background-color: rgba(0, 0, 0, 0.9);
}

/* Active number */
.active {
    background-color: rgba(255, 255, 255, 0.8);
    color: black;
}


.btn_link a
{
 padding: 10px 15px;  display: block;
 font-size: 14px; line-height:14px; text-transform:uppercase;
  color: #fff;
text-align: center;
  background-color: #c4c4c4;
}
.btn_link a:hover {
background-color: #999999;  }