/* create by cleanstyle.uk */
/* ================================= MAIN =================================*/
html, body { height:100%;}
body {margin:0; padding:0; font-size:18px; min-height:100%; height:auto!important; height:100%; position:relative; line-height: 30px; background:#ffffff; color:#212529; font-family: 'Montserrat', sans-serif;}
body p {margin-bottom: 15px;}
img {border:none; outline:none;}
a {outline-style: none; color:#212529; cursor: pointer;}

.h1 {font-size: 40px; font-weight: 600;}
.h2 {font-size: 36px; font-weight: 600;}
.h3 {font-size: 30px; font-weight: 600;}
.h4 {font-size: 22px; font-weight: 600;}
.h5 {font-size: 18px; font-weight: 600;}
.h6 {font-size: 14px; font-weight: 600;}

h1, h2, h3, h4, h5, h6 {font-family: 'Montserrat', sans-serif;}
.h1, .h2, .h3, .h4, .h5, .h6 {font-family: 'Montserrat', sans-serif;}

#container {margin:0 auto; padding:0; position: relative; overflow:hidden;}

/* ================================= header =================================*/
.btn {padding: 0px 60px; line-height: 70px; font-weight: 600; font-size: 22px; background: transparent; border-radius: 3px;}
.btn:hover {color: #ffffff; background-color: #BA93AE; border-color: #BA93AE;}
.btn-primary {border: 2px solid #BA93AE; color:#BA93AE;}
.btn-check:checked + .btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check) + .btn:active {color:#ffffff; background-color: #BD64A2; border-color: #BD64A2;}

.navButton {line-height: 70px; cursor: pointer; font-size: 24px;}

.breadcrumbs {}
.breadcrumbs ul {margin: 0px; padding: 0px;}
.breadcrumbs ul li {list-style: none; display: inline-block;}
.breadcrumbs a {text-decoration: none; color:#212529; line-height: 50px;}
.breadcrumbs i {font-size: 14px;}

.bg-purple {background:#F7F5FF;}

.youtube-background {height: 900px; position: relative; z-index: 10;}
.youtube-background::before {position: absolute; content: ''; width: 100%; height: 100%; background: rgba(33, 37, 41, .8); left: 0px; top:0px; z-index: 11;}

.home {height: 900px;}

.pages {position: relative; z-index: 100; height: 320px; padding: 100px 0 0 0; background-position: center center;}
.pages::before {position: absolute; z-index: 20; left: 0px; top: 0px; width: 100%; height: 100%; content: ''; background:rgba(33, 37, 41, .8);}
.pages h1 {position: relative; z-index: 100;}

.top {position: fixed; left: 0px; top: 0px; z-index: 500; background: url('/catalog/view/theme/cleanstyle/images/top_shadow.png') repeat-x left top; height: 100px; padding: 15px 0; width: 100%; transition: background-color .5s;}
.top .logo {height: 60px; width: auto;}
.top .logo img {height: 100%; width: auto;}

.header {position: relative;}
.header .menu {margin: -9999px 0 0 0; padding: 0px; background: #212529; opacity: 0.2; transition: opacity .3s;}
.header .menu li {list-style: none; display: inline-block; width: 100%;}
.header .menu li a {color: #ffffff; text-decoration: none; line-height: 70px; padding: 0 15px 0 15px; transition: color .3s, background .3s; width: 100%; display: inline-block;}
.header .menu li a:hover {color: #212529; background-color: #BA93AE;}
.header .menu li a.active {color: #BA93AE; border-bottom: 2px solid #BA93AE;}

.header .social {margin: -9999px 0 0 0; padding: 15px 0; background: #F8F9FA; text-align: center; opacity: 0.2; transition: opacity .3s;}
.header .social li {list-style: none; display: inline-block; margin: 0 15px;}
.header .social li a {color: #212529; text-decoration: none; line-height: 40px; padding: 0; width: 40px; display: inline-block; text-align: center; border-radius: 3px; transition: background .3s, color .3s;}
.header .social li a:hover {background: #BA93AE; color:#ffffff;}

.header .mobile {opacity: 1; margin: 0px;}

.header .cart {padding: 10px 0;}
.header .cart a {color: #ffffff; text-decoration: none; line-height: 50px; background: #BA93AE; display: inline-block; width: 100%; text-align: center; border-radius: 3px; font-weight: 700; transition: background .3s, color .3s;}
.header .cart a:hover {background: #ffffff; color:#212529;}

.home {position: relative; z-index: 40; padding: 260px 0 0 0;}
.home .container {position: relative; z-index: 45;}
.home .logo {width: 100%;}
.home .logo img {height: 150px;}
.home .book a {display: inline-block; padding: 0 60px; border:1px solid #ffffff; color:#ffffff; line-height: 70px; text-decoration: none; font-weight: 600; font-size: 22px; transition: background .3s, color .3s; border-radius: 3px;}
.home .book a:hover {background: #ffffff; color:#BA93AE;}
.arrow {position: absolute; bottom: 30px; left: calc(50% - 15px); z-index: 50; color:#ffffff; font-size: 30px; width: 30px; text-align: center;}
#g_captch > div {margin:0 auto;}

/* ================================= content =================================*/
.about {padding: 90px 0;}
.about .container {}
.about .shape {width: 412px; height: 133px; position: absolute; left: -120px; top: -30px; z-index: 20px;}
.about .member_1 {z-index: 30px; position: relative;}
.about .member_2 {z-index: 40px; position: relative;}
.about ul {}
.about ul li {list-style: disc;}

.category_description {}
.category_description ul li {list-style: disc;}

.services {padding: 90px 0;}
.services .item {background: #ffffff; padding: 45px 30px; position: relative; height: 460px; color:#212529; transition: color .5s, top .5s, box-shadow 1s; top: 0px; margin-bottom: 30px; max-width: 400px; margin-left: auto; margin-right: auto;}
.services .item::before {position: absolute; left: 10px; top: 10px; width: calc(100% - 20px); height: calc(100% - 20px); border:1px solid #BA93AE; content: '';}
.services .item a {text-decoration: none; color:#212529; transition: color .3s;}
.services .item .subtitle {font-size: 14px; position: relative; z-index: 50;}
.services .item .title {font-size: 22px; font-weight: 600; position: relative; z-index: 60;}
.services .item .description {position: relative; z-index: 70;}
.services .item .details {position: absolute; bottom: 45px; width: 100%; left: 0px; text-decoration: none; z-index: 80;}
.services .item .details i {color:#BA93AE;}
.services .item .video {width: calc(100% - 20px); height: calc(100% - 20px); position: absolute; z-index: 10; left: 10px; top: 10px; opacity: 0; transition: opacity 1s; overflow: hidden;}
.services .item .video::before {content: ''; width:100%; height: 100%; position: absolute; z-index: 11; background: rgba(248, 249, 250, .7);}
.services .item:hover .video {opacity: 1;}
.services .item:hover {color:#212529; top: -10px; box-shadow: 0 0 40px rgba(33, 37, 41, 0.2);}
.services .item:hover a {color:#212529;}

.consultations {padding: 90px 0; background: #D2E1DC;}
.consultations .silhouette {position: relative; z-index: 50;}
.consultations .splash {position: absolute; z-index: 40; left: 0; top:50px;}

.booking {padding: 90px 0; background: url('/catalog/view/theme/cleanstyle/images/background_book3.jpg') no-repeat left top; position: relative; background-size: cover; background-attachment:fixed;}
.booking::before {content: ''; position: absolute; top: 0px; left: 0px; background: rgba(33, 37, 41, .7); width: 100%; height: 100%; z-index: 50;}
.booking .book_in {background: #ffffff; padding: 90px 0; border-radius: 5px; position: relative; z-index: 60;}

.gift {padding: 90px 0;}
.gift ul {}
.gift ul li {list-style: disc;}

.advantages {padding: 90px 0;}
.advantages .item {background: #ffffff; position: relative; padding: 30px; /* min-height: 540px; */ top: 0px; transition: top .5s, box-shadow 1s;}
.advantages .item::before {position: absolute; left: 10px; top: 10px; width: calc(100% - 20px); height: calc(100% - 20px); content: ''; border:1px solid #BA93AE;}
.advantages .item .title {font-weight: 600;}
.advantages .item .image {background: url('/catalog/view/theme/cleanstyle/images/edge_bg.png') no-repeat center center; display: inline-block; width: 120px; text-align: center; height: 65px; padding: 10px 0 0 0;}
.advantages .item:hover {top: -10px; box-shadow: 0 0 40px rgba(33, 37, 41, 0.2);}

.rewievs {padding: 90px 0;}
.rewievs .item {border:1px solid #DDDDDD; padding: 15px 15px 15px 15px; position: relative; min-height: 400px;}
.rewievs .item .label {position: absolute; right: 15px; bottom: 15px;}
.rewievs .item .name {font-weight: 600;}
.rewievs .item .date {font-weight: 400; font-size: 14px; color:#BA93AE;}
.rewievs .item .position {font-size: 14px;}

.categories {padding: 90px 0;}
.categories img {border-radius: 3px;}
.categories .title {font-size: 32px; font-weight: 600; line-height: 40px;}
.categories a:not(.btn) {font-size: 22px; font-weight: 600; text-decoration: none; color:#BA93AE; display: inline-block; line-height: 74px;}
.categories .bg-white:nth-child(1) {padding-top:0px!important;}

.masters_description {}
.masters_description .item:last-child {margin-bottom:0px!important;}

.prices {padding: 90px 0;}
.prices ul {margin: 0px; padding: 0px;}
.prices ul li {margin: 0px; padding: 10px 0; border-bottom:1px dashed #dedede;}
.prices .service_name {display: inline-block; width: calc(100% - 120px);}
.prices .service_price {display: inline-block; width: 110px;}

.salons {}
.salons .data {}
.salons .data i {width: 46px; height: 46px; line-height: 46px; text-align: center; border:1px solid rgba(33, 37, 41, 0.1); margin-right: 10px; border-radius: 23px;}
.salons .additional {bottom: -50px; left: 0px; width: 90%; margin:0 5%; position: absolute;}
.salons .additional .vtour {position: absolute; width: calc(100% - 1.5rem); height: 100%; padding: 10px 0 0 0; overflow: hidden; text-decoration: none; font-weight: 700; color:#F8F9FA; text-align: center; border-radius: 0.375rem; font-size: 14px;}
.salons .additional .vtour::before {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; content: ''; background: rgba(33, 37, 41, 0.5); z-index: 50;}
.salons .additional .vtour img {width: 100%; position: relative;}
.salons .additional .logo {width: 90%; margin:0 5%; position: relative; z-index: 100;}
.salons .additional .logo img {width: 40%; margin:0 30%;}
.salons .image {position: relative;}
.salons .image .zoom {position: absolute; width: 60px; height: 60px; background: rgba(248, 249, 250, 0.5); line-height: 60px; text-align: center; top: 15px; right: 15px;}
.salons .image .zoom i {font-size: 26px; line-height: 60px;}
#salon1 iframe {width: 100%; height: 100%; position: absolute;}

.modal-body {}
.modal-body ul {}
.modal-body ul li {list-style: disc;}
.modal-body .separator {width: 100%; height: 1px; border:1px dashed #dedede;}

.footer {padding: 90px 0; color:#909090;}
.footer .logo {max-width:140px; margin:0 auto;}
.footer a {color:#909090;}
.footer img {opacity: 0.6;}
.footer .menu {color:#909090; font-size: 16px; padding: 0px;}
.footer .menu li {list-style: none; display: inline-block; color:#909090;}
.footer .menu li a {display: inline-block; color:#909090; padding: 15px; text-decoration: none; font-size: 16px;}
.footer .menu li a:hover {color:#BA93AE; text-decoration: none;}
.footer .social {text-align: center; width: 100%; position: relative; padding-left:0px;}
.footer .social::before {content: ''; width: 100%; position: absolute; left: 0px; top: 20px; border-bottom:1px solid #909090; z-index: 60; display: none;}
.footer .social li {list-style: none; display: inline-block; position: relative; z-index: 100; margin-bottom: 15px;}
.footer .social li a {color:#909090; width: 40px; height: 40px; border-radius: 20px; line-height: 38px; text-align: center; border:1px solid #909090; display: inline-block; margin: 0 10px; background: #212529; transition: background .3s, color .3s, border .3s;}
.footer .social li a:hover {background: #BA93AE; color:#ffffff; border:1px solid #BA93AE;}

/* ================================= footer =================================*/

/* ================================= */

/*  SM  Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
	
}

/*  MD  Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
	.h1 {font-size: 52px; font-weight: 600;}
	.h2 {font-size: 48px; font-weight: 600;}
	.h3 {font-size: 42px; font-weight: 600;}
	.h4 {font-size: 32px; font-weight: 600;}
	.h5 {font-size: 18px; font-weight: 600;}
	.h6 {font-size: 14px; font-weight: 600;}
}

/*  LG  Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
	.h1 {font-size: 60px; font-weight: 600;}
	.h2 {font-size: 48px; font-weight: 600;}
	.h3 {font-size: 26px; font-weight: 600;}
	.h4 {font-size: 22px; font-weight: 600;}
	.h5 {font-size: 18px; font-weight: 600;}
	.h6 {font-size: 14px; font-weight: 600;}

	.header .menu {margin: 0px; padding: 0px; background: transparent; opacity:1;}
	.header .menu li {list-style: none; display: inline-block; width: auto;}
	.header .menu li a {color: #ffffff; text-decoration: none; line-height: 60px; padding: 0 10px 0 10px; transition: color .3s; width: auto; display: inline-block;}
	.header .menu li a:hover {color: #BA93AE; border-bottom: 2px solid #BA93AE; background: transparent;}
	.header .menu li a.active {color: #BA93AE; border-bottom: 2px solid #BA93AE;}
	.header .social {margin: 0px; opacity: 1; background: transparent;}
	.header .social li {margin:0px;}
	.header .social li a {color:#F8F9FA;}

	.salons .additional .logo img {width: 60%; margin:0 20%;}

	.categories .title {font-size: 48px; line-height: 60px;}

	.footer .social::before {content: ''; width: 100%; position: absolute; left: 0px; top: 20px; border-bottom:1px solid #909090; z-index: 60;}
	.footer .social li {margin-bottom: 15px;}
}

/*  XL  Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
	.header .menu li a {padding: 0 15px 0 15px;}
}

/*  CS md  Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1400px) {

}

/*  CS xl  Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1600px) {

}
