/*
	Template: Lovely Cosmetics Responsive HTML Template
	Version: 1.0
	Author: Axact Idea
	Email: axactidea@gmail.com
	ThemeForest Profile: https://themeforest.net/user/axactidea
*/
/* ------------------------------------------------------ */
/*         TABLE OF CONTENTS                              */
/* ------------------------------------------------------ */
/*   01 - Min width : 768px   */
/*   09 - Max width : 768px   */
/*   10 - Max width : 480px   */
/*   11 - Max width: 1170px & Min width: 768px   */
/*   12 - Maximum width: 620px and Minimum Width: 480px   */
/* ------------------------------------------------------ */



/*------------------------------------------------------------------------------*/
/*                    Minimum width : 768px 
/*------------------------------------------------------------------------------*/
@media screen and (min-width:768px) {
    
/* slideshow */
.slide-image {
  width:100%;
}
/* footer */
.payment-methods
{
  text-align:right;
}
.footer-links {
  text-align:left;
}
/* navigations */
.hidden-menu-trigger {
  top: 16px;
  right: 10px;
  font-size: 16px;
  font-size: 1rem;
}
.top-nav li:hover > ul {
  display:block;
  z-index:10;
}
.top-nav li:hover > ul ul {
  left:100%;
  margin:-2.5rem 0;
  width:100%;
}
/* paddings */
.padding-l-right-30 {
  padding-right:30px !important; 
}
.padding-l-left-40 {
  padding-left:30px !important;
}
/* margins */
.margin-l-bottom-40 {
  margin-bottom:40px;
}

.margin-l-top-40 {
  margin-top:40px;
}

/* **************************************************** */
/* 												*/
/* **************************************************** */



}



/*------------------------------------------------------------------------------*/
/*                    Maximum width : 768px
/*------------------------------------------------------------------------------*/
@media screen and (max-width:768px) {    
.hide-l, .hide-s {
  display:block;
}


div#comanda:after{
    background-image: none;
}

#top_banner .slide-description {
    top: 61%;
}

#top_banner .slide-description .hide-s{
    display:inline;
}

.hide-m {
  display:none;
}
.section  {
  padding: 3em 1.30em;
}
.margin-m-bottom {
  margin-bottom:2.5rem;
}
.margin-m-bottom-60 {
  margin-bottom:60px;
}
.margin-m-top-60 {
  margin-top:60px;
}
.margin-m-top-40 {
  margin-top:40px;
}

body{
	font-size: 16px;
    line-height: 21px;
}

/* headings */
h1 {
  font-size:1.8em;
  line-height: 1.3em;
}
h2, h4 {
  font-size:1.5em;
  line-height: 1.3em;
}
h3 {
  font-size:1.2em;
  line-height: 1.3em;
}

/* logo */
.logo img {
	margin:0 auto;
	width:  auto;
	padding-top: 45px; 
}


/* navigation */
nav {
  display:block;
  cursor:pointer;
  line-height:3;
}

a.nav-text{
	color: black;
}

nav>div.line{
    padding:    0 !important;
}

nav .logo{
	position: relative;
}

.top-nav {
    top: 0;
    right: unset;
	position: absolute;
}

.top-nav li {
  float:none;
  list-style:none outside none;
  padding:0;
}
.top-nav li a,.top-nav li a.icon_facebook,.top-nav li a.icon_youtube {
  border-bottom:1px solid #000;
  color:    #000;
  display:block;
  padding:0.600rem 0.625rem;
  text-align:center;
  text-decoration:none;
  background-image:none;
  height:auto;
  width:auto;
}
.top-nav li a.icon_facebook {

}
.top-nav li a.icon_facebook span,.top-nav li a.icon_youtube span {
display:block;
}
.top-nav li a:hover,.top-nav li a.icon_facebook:hover,.top-nav li a.icon_youtube:hover {
    border-bottom:1px solid #636b70;
    color:  #636b70;
	padding: 0.600rem 0.625rem;
  background-image:none;    
}
.top-nav > ul {
  background-color: rgba(255,255,255,0.85);
  height:0;
  max-width:100%;
  overflow:hidden;
  position:relative;
  z-index:999;
  border:none;
	margin: 0;
}
#top_wrapper .scrolled ul {
	border: none;
}
.top-nav > ul.show-menu,.aside-nav.minimize-on-small > ul.show-menu {
  height:auto;
}
.top-nav ul ul {
  left:0;
  margin-top:0;
  position:relative;
  right:0;
}
.top-nav li ul li a {
  min-width:100%;
}
.top-nav li ul,.top-nav li ul li ul {
  display:block;  
  overflow:hidden; 
  height:0;   
}
.top-nav > ul ul.show-ul {
  display:block;
  height:auto;
}
.top-nav li ul li a {
  background:none repeat scroll 0 0 #f4f1f0;
  border-bottom:1px solid #fff;
  padding:0.625rem;
}
.top-nav li ul li ul li a {
  background:none repeat scroll 0 0 #f7f7f7;
  border-bottom:1px solid #fff;
}
.top-nav .right {
  float: none;
}
.nav-text {
  color:#133b69;
  display:block;
  font-size:1.2rem;
  line-height:2;
  max-width:100%;
  text-align:center;
  vertical-align:middle;
  background-color: rgba(255,255,255,0.45);
}
.nav-text:after {
  content:"\f0c9";
  font-family: 'FontAwesome';
  font-size:2.1rem;
  margin-left:0.5rem;
  text-align:right;
}

#mainnav .line>div:first-child{
    padding-top:    5px;
}

#top_banner .slide-title img{
   display:none;
}

/* top bar */
#topbar ul {
  display: flex;
  justify-content: center;
}
#topbar ul li, #topbar ul li:last-child {
  padding:0;
}
#topbar-primary ul {
  display: flex;
  justify-content: center;
}


/* stamp */

div.owl-carousel div.slide1 div.slide-description div.stamp {
    bottom: -55px;
    left:   -22px;
}

/* slideshow */

#top_banner{
    height: 500px;
	background-size: cover;
	background-image: url('../img/header_bg.jpg');
	background-position: center;
}

#top_banner .slide-picture{

}
#top_banner .s-left .slide-picture {
	left:10%;
}
#top_banner .slide-description {
    left:   auto;
    right:  20px;
    bottom: 45px;
}

#top_banner .description-wrapper .line {
	background-position: right -119px top;
    background-size: cover;
}

#top_banner .slide-title h2 {
    font-size: 36px;
    line-height: 35px;
	text-shadow: 4px 4px 10px #666, -4px -4px 10px #666, -4px 4px 10px #666, 4px -4px 10px #666;
}

#top_banner .slide-title h2 span.line-2{
    font-size: 33px;
	margin-right: 58px;
    line-height: 39px;	    
}
#top_banner .slide-title h5{
    font-size: 18px;
    line-height:21px;
	text-shadow: 4px 4px 10px #666, -4px -4px 10px #666, -4px 4px 10px #666, 4px -4px 10px #666;    
}

/* footer */
footer .phone-number {
  font-size:0.9rem;
}

footer .phone-number h5 {
  font-size:1.1rem;
}

.payment-methods {
  text-align:center;
}
.footer-links {
  text-align:center;
  margin-bottom:20px;
}
.footer-block {
  margin:15px 0;
}

.footer-links>*{
    float: none !important;
}

/* **************************************************** */
/* 												*/
/* **************************************************** */

#top_banner .slide-button-wrapper div.line{
    margin-left: 60px;
}

#top_banner .slide-button{
    padding-left:   20px;
}


#top_banner .s-left .slide-picture img {
     -ms-transform: translate(-25%, 42%);
    -moz-transform: translate(-25%, 42%);
    -webkit-transform: translate(-25%, 42%);
    transform: translate(-25%, 42%);
    min-height: 230px;
}
#top_banner .s-left .slide-descr {
  	top: 20%;
}
#top_banner .s-right .slide-descr {
	right: 12vw;
	top: 50%;
}
#top_banner h3.head1 {
    font-size: 2.6vw;
}
#topbar .line>div{
	display:none;
}
div#incepe h4{
	font-size: 30px;
}
#top_banner h4.head2 {
    font-size: 10vw;
	line-height: 6vw;
	padding-bottom: 4vw;
}
#top_banner .slide-descr a {
    font-size: 3.4vw;
}
#top_banner .description-wrapper .line > div.comm{
	height:	auto;
}
#top_banner .comm h3{
	font-size:	6vw;
	line-height: 1.4em;
}
div#colagen{
	background:none;
	padding-top:0;
}
div#colagen div.line-1{
    background-image: url(../img/colagen_bg.png);
    background-size: contain;
    background-position: center bottom;
    background-repeat: no-repeat;
	margin: -3em -1.30em;
    padding: 4em 1em;
    background-color: #84d5dd;
}
div#colagen .line-1 div {
    margin: 0 5%;
}
div#colagen .line-2 .flex {
    display: block;
}
div#colagen .line-2 .column-left {
    border-right: none;

}
div#aspasia .column-right img {
    width: 45vw;
}
div#aspasia p:last-child:before{
	display:none;
}
div#aspasia2 .line-1 .flex {
    display: block;
}
div#aspasia2 .column-left:before {
    right: -10%;
}
div#aspasia2 .column-right:before {
    left: -10%;
}
div#aspasia3 img {
    display:none;
}
div#aspasia3 h4 {
    text-align: left;
    float: left;
}
div#blog .column-left h3{
	text-align:center;
	padding-right:0;
}
div#blog .flex{
	display:block;
}
div#blog .column-right{
	margin: 0 -1.3em;
    width: 100vw;
}
div#sprancene8 h3 {
    font-size: 27px;
}
div#sprancene8 .accordion h4{
	font-size: 16px;
	padding: 5px 34px 5px 20px;
}
div#sprancene8 .accordion h4.ui-state-active::after {
    top: 12px;
}
div#sprancene8 .accordion h4::after {
    top: 6px;
}
div#sprancene8 .accordion div p{
	font-size: 14px;
}
div#sprancene8 p{
	padding: 5px 20px;
	font-size: 16px;
}
div#comanda div.img-wrapper-1:after{
    left:   -125%;
}

div#comanda .title{
    text-align: center;
    margin-top: 3rem;
    margin-bottom:  2rem;
    margin-left:    0;
}

div#comanda div.comanda-image{
    margin-top: 4rem;
    margin-left:    4%;
    width:  100%;
}

div#comanda div.comanda-gel{
    margin-bottom: 1rem;
}

div#comanda div.comanda-spray div.comanda-description-left{
    padding-top:    4rem;
}


div.section div.l-separator{
	display:	none;
}
div.section div.m-separator{
	display:	block;
	height:	1px;
	width:	10%;
	clear:	both;
	margin:	0 auto 0 auto;
	background-color:	#ccc;		
}

.carousel-main .image-box  .image{
	margin-left:	-560px;
}

#top_banner .slide-description a{
    font-size:  1em;
    line-height: 1em;
}



}


/*------------------------------------------------------------------------------*/
/*                    Maximum width : 480px 
/*------------------------------------------------------------------------------*/
@media screen and (max-width:480px) {
.hide-l, .hide-m {
  display:block;
}
.hide-s {
  display:none !important;
}
.section  {
  padding: 2.5rem 0.7rem;
}
.margin-s-bottom-60 {
  margin-bottom: 60px;
  display: block;
}

/* navigation */
nav {
  padding:0;
}
#main-nav li a {
  padding: 20px 10%;
  font-size: 1.2em;
}

/* top bar */

#top_banner{
    height: 550px;
}
#top_banner .description-wrapper .line{
	background-image:none;
}
#top_banner .description-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
#top_banner .description-wrapper .line .slide-description{
    bottom: 0;
}

#top_banner .slide-description{
    left:   10px;
}


.logo img{
    height: auto;
    width:  90%;
	max-width: 200px;
}


#top_banner .slide-description{
    max-width: 100%;
    width:  100%;
    bottom: 50px;
    margin-left: -0.625rem;

}

div#top_banner .slide-title{
    padding:    0.8em 0.6em;
}

#top_banner .s-right .slide-descr {
    right: 14vw;
	top: 50%;
	width: 180px;
}
#top_banner .s-left .slide-descr {
	top: 25%;
    width: 75vw;
}
#top_banner h3.head1 {
    font-size: 20px;
}
#top_banner h4.head2 {
    font-size: 55px;
	line-height: 30px;
	padding-bottom: 23px;
}
#top_banner .slide-descr a {
    font-size: 21px;
}
#top_banner .s-left .slide-picture{
	left: 0;
    right: 0;
    transform: none;
    top:50%;
}
#top_banner .s-left .slide-picture img {
    -ms-transform: translate(-3%, 0);
    -moz-transform: translate(-3%, 0);
    -webkit-transform: translate(-3%, 0);
	transform: translate(-3%, 0);
    min-height: 164px;
}
#top_banner .s-left .slide-picture:before {
    bottom: -14%;
    height: 20vw;
    width: 20vw;
    z-index: 1;
}
#top_banner .s-right .slide-picture img {
    -ms-transform: translate(44%, 8%);
    -moz-transform: translate(44%, 8%);
    -webkit-transform: translate(44%, 8%);
    transform: translate(44%, 8%);
	min-height: 290px;
}
div#top_banner .slide-button{
    text-align: center;
    padding-left: 0px;
}

#top_banner .slide-button-wrapper{
    margin-top: 0.5rem;
}

#top_banner .slide-button-wrapper div.line{
    margin-left: 0;
}

#top_banner div.recomandare{
    bottom: 10px;
    width:  100%;
    left:   0;
}

#top_banner div.recomandare{
    max-height: 115px;
}

#top_banner div.recomandare div.sign-wrapper img{
    width: 80px;
}

div#colagen .line-4 .column-left {
    padding: 1.3rem 1rem;
}
div#colagen .line-5 .column-left {
    padding: 1.3rem 1rem;
}
div#colagen .line-3 td,div#colagen .line-3 td.c1 {
	font-size:3.3vw;
}
div#blog .column-right {
    margin: 0 -0.7rem;
}
div#instagram h3 {
    font-size: 9vw;
}

.footer-links {
  text-align:center;
  margin-bottom:20px;
}
.footer-block {
  margin:15px 0;
}


}

/*------------------------------------------------------------------------------*/
/*    Maximum width: 1280px and Minimum Width: 768px | Between Desktop and Tablets
/*------------------------------------------------------------------------------*/
@media screen and (max-width:1280px) and (min-width:769px) {


.logo img{
    height: auto;
    width:  18vw;
}

/* navigations */
.top-nav-logo{
    width:25%;
}
.top-nav {
  padding-right:0;
  width:    75%;
}
.top-nav li a {
	font-size: 1.7vw;
    padding: 1.2vw 0.7vw 1.7vw;
}
.top-nav li a:hover {
    padding-top: 1.3vw;
    padding-bottom: 1.6vw;
}
nav{
    height: 60px;
}
#topbar ul{
    margin-left:    15px;
}

#top_banner{

}

#top_banner .slide-description{
    min-width:  470px;
}

#top_banner .slide-title h2 {
    font-size: 5vw;
	line-height: 4vw;	
}
#top_banner .slide-title h2 span.line-2{
    font-size: 3.7vw;
	line-height: 4.3vw;
	margin-right: 11vw;
}
#top_banner .slide-title h5 {
	font-size: 1.9vw;
    line-height: 2.3vw;
}
#top_banner .description-wrapper .line > div.comm{
	height:	auto;
}
#top_banner .comm h3{
	font-size:	3.4vw;
	line-height: 1.4em;
}
div#colagen .line-1 div {
    font-weight: 800;
    font-size: 1.6vw;
    line-height: 2vw;
    margin: 0 8%;
    padding-bottom: 3rem;
}

@media screen and (max-width:1000px) {
body {
	font-size: 13px;
	line-height: 19px;
}
#top_banner .s-left .slide-picture{
    left:   -5vw;
}
div#sprancene8 h3 {
    font-size: 27px;
}
div#sprancene8 .accordion h4{
	font-size: 16px;
	padding: 5px 20px;	
}
div#sprancene8 .accordion div p{
	font-size: 14px;
}
div#sprancene8 p{
	padding: 5px 20px;
	font-size: 16px;
}

.footer-links>*{
    float: none !important;
}

}/*end of min 1000*/


}/* end of 768-1280*/




/*###########################*/
@media screen and (min-width:1400px) {
body {
	font-size: 18px;
	line-height: 22px;
}
#top_banner {

}
#top_banner .description-wrapper{
	background-image: url('../img/header_face.png');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: right +20vw top;	
}
#top_banner .description-wrapper .line{
 	background:none;    
}
#top_banner .s-left .slide-descr {
    left: 28px;
	width:500px;
}
#top_banner h3.head1 {
    font-size: 23px;
	line-height:29px;
}

.top-nav {

}

div#sprancene8 h3 {
    font-size: 38px;
}
div#sprancene8 .accordion h4{
	font-size: 22px;
	padding: 7px 28px;	
}
div#sprancene8 .accordion div p{
	font-size: 20px;
}
div#sprancene8 p{
	padding: 7px 28px;
	font-size: 22px;
}
}