html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, a, em, img, q, s, small, strike, strong, tt, dl, dt, dd, ol, ul, li, form, label, table, tbody, tfoot, thead, tr, td, section, aside { border: 0px none; outline: 0px none; font-weight: inherit; font-style: inherit; margin: 0px; padding: 0px; }
:focus { outline: 0px none; }
ol, ul, li { list-style: outside none none; }
blockquote::before, blockquote::after, q::before, q::after { content: ""; }
button::-moz-focus-inner, input::-moz-focus-inner { border: medium none; padding: 0px; margin: 0px; }
@font-face {
font-family: "PF Bulletin Sans Pro";
font-style: normal;
font-weight: 400;
src: url('../fonts/pfbulletinsanspro-regular.eot') format("embedded-opentype"), url('../fonts/pfbulletinsanspro-regular.woff') format("woff"), url('../fonts/pfbulletinsanspro-regular.ttf') format("truetype"), url('../fonts/pfbulletinsanspro-regular.svg') format("svg");
}
@font-face {
font-family: "PF Bulletin Sans Pro";
font-style: normal;
font-weight: 600;
src: url('../fonts/pfbulletinsanspro-medium.eot') format("embedded-opentype"), url('../fonts/pfbulletinsanspro-medium.woff') format("woff"), url('../fonts/pfbulletinsanspro-medium.ttf') format("truetype"), url('../fonts/pfbulletinsanspro-medium.svg') format("svg");
}
body { position: relative; font-family: "PF Bulletin Sans Pro",sans-serif; color: rgb(102, 98, 107); font-size: 18px; font-weight: 400; line-height: 1; background: rgb(241, 241, 241) none repeat scroll 0% 0%; }
a { color: rgb(255, 193, 4); text-decoration: none; }
a:hover { color: rgb(186, 134, 235); }
b, strong { font-weight: 600; }
.clear { clear: both; }
.clr::after { content: ""; display: block; clear: both; }
.wrap { margin: 0px auto; padding: 0px 10px; max-width: 980px; }
.title { margin-bottom: 40px; line-height: 32px; color: rgb(62, 53, 75); font-size: 28px; font-weight: 600; text-align: center; }
.add-title { margin: -20px 0px 40px; line-height: 25px; color: rgb(106, 98, 117); font-size: 23px; font-weight: 600; text-align: center; }
.button, .button-yel, .button-grey { display: table; margin: 30px auto 0px; padding: 18px 25px 15px; font-size: 24px; font-weight: 600; text-align: center; text-transform: uppercase; border: medium none; border-radius: 3px; box-sizing: border-box; }
.button { color: rgb(255, 255, 255); border-bottom: 4px solid rgb(177, 28, 25); box-shadow: 0px 0px 50px rgba(204, 27, 24, 0.4); background: transparent -moz-linear-gradient(center top , rgb(241, 58, 54), rgb(210, 56, 54)) repeat scroll 0% 0%; }
.button:hover { color: rgb(255, 255, 255); border-bottom: 4px solid rgb(149, 7, 4); box-shadow: 0px 0px 50px rgba(204, 27, 24, 0.6); background: transparent -moz-linear-gradient(center top , rgb(249, 41, 36), rgb(196, 16, 12)) repeat scroll 0% 0%; }
.button-yel { position: relative; z-index: 2; margin: 0px auto; width: auto; color: rgb(152, 56, 10); border-bottom: 4px solid rgb(214, 93, 20); box-shadow: 0px 0px 50px rgba(236, 122, 0, 0.4); background: transparent -moz-linear-gradient(center top , rgb(255, 193, 4), rgb(255, 144, 54)) repeat scroll 0% 0%; }
.button-yel:hover { color: rgb(153, 88, 3); border-bottom: 4px solid rgb(214, 130, 20); box-shadow: 0px 0px 50px rgba(236, 122, 0, 0.6); background: transparent -moz-linear-gradient(center top , rgb(255, 217, 4), rgb(255, 172, 52)) repeat scroll 0% 0%; }
.button-grey { padding-right: 15px; padding-left: 15px; color: rgb(124, 134, 144); font-size: 20px; border-bottom: 4px solid rgb(169, 180, 192); background: transparent -moz-linear-gradient(center top , rgb(216, 223, 231), rgb(205, 213, 222)) repeat scroll 0% 0%; }
.button-grey:hover { color: rgb(96, 106, 116); border-bottom: 4px solid rgb(146, 157, 168); background: transparent -moz-linear-gradient(center top , rgb(202, 210, 217), rgb(178, 187, 196)) repeat scroll 0% 0%; }
.play { display: inline-block; margin-bottom: 15px; padding: 12px 0px 0px 60px; height: 33px; color: rgb(143, 99, 185); font-size: 19px; font-weight: 600; background: transparent url('../images/play.png') no-repeat scroll 0px -45px; }
.play:hover { color: rgb(249, 177, 3); background-position: 0px -90px; }
#head { position: relative; padding: 25px 0px 0px; background: rgb(79, 78, 156) url('../images/head.jpg') no-repeat scroll center bottom -92px; }
#head .wrap { position: relative; z-index: 4; }
#logo { float: left; width: 190px; height: 58px; color: rgb(234, 228, 242); background: transparent url('../images/logo.png') no-repeat scroll 0% 0%; }
#presentation { position: absolute; display: table; top: 7px; left: 50%; margin-left: -100px; padding-left: 60px; height: 45px; color: rgb(255, 255, 255); font-size: 14px; background: transparent url('../images/play.png') no-repeat scroll 0% 0%; }
#presentation2 { display: none; margin: 15px auto 0px; padding-left: 60px; height: 45px; color: rgb(255, 255, 255); font-size: 14px; background: transparent url('../images/play.png') no-repeat scroll 0% 0%; }
#presentation p, #presentation2 p { padding-top: 7px; }
#presentation span, #presentation2 span { display: block; font-size: 19px; font-weight: 600; }
#presentation:hover, #presentation2:hover { color: rgb(249, 177, 3); background-position: 0px -90px; }
#login { float: right; margin-top: 20px; }
#login a { float: left; color: rgb(255, 255, 255); font-size: 21px; }
#login a:hover { color: rgb(249, 177, 3); }
#login a:last-child { position: relative; margin-left: 35px; }
#login a:last-child::before { content: ""; position: absolute; top: -2px; left: -18px; width: 2px; height: 24px; background: rgb(148, 146, 218) none repeat scroll 0% 0%; }
#head h1 { clear: both; margin: 0px auto; padding: 50px 8px 0px; line-height: 50px; max-width: 820px; color: rgb(255, 255, 255); font-size: 42px; font-weight: 600; text-transform: uppercase; text-align: center; }
#main-text { margin: 15px auto 90px; max-width: 750px; line-height: 26px; color: rgb(255, 255, 255); font-size: 23px; text-align: center; }
#arrow { position: absolute; z-index: 1; bottom: 30px; right: 80px; width: 240px; height: 90px; background: transparent url('../images/arrow.png') no-repeat scroll right center; }
#number { margin-top: 35px; line-height: 36px; color: rgb(255, 255, 255); font-size: 19px; text-align: center; }
#screen2 { position: relative; }
#screen2-body { position: relative; z-index: 2; padding: 120px 0px 100px; background: transparent url('../images/bg-two.jpg') no-repeat scroll center 92px; }
#screen2::before { content: ""; position: absolute; top: 0px; left: 0px; width: 100%; height: 92px; background: transparent url('../images/head.jpg') no-repeat scroll center bottom; }
#screen2::after { content: ""; position: absolute; z-index: 3; bottom: 0px; left: 0px; width: 100%; height: 80px; background: transparent url('../images/bg-three-t.png') no-repeat scroll center top; }
.review-people { float: right; position: relative; z-index: 2; width: 250px; text-align: center; }
.review-people p { line-height: 19px; font-size: 17px; }
.rp-img { overflow: hidden; margin: 0px auto 20px; width: 140px; height: 140px; border: 3px solid rgb(255, 255, 255); border-radius: 50%; box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.15); }
.rp-img2 { overflow: hidden; margin: 0px auto 20px; max-width: 400px; max-height: 400px; border: 3px solid rgb(255, 255, 255); border-radius: 50%; box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.15); }
.rp-img2 { overflow: hidden; margin: 0px auto 20px; max-width: 400px; max-height: 400px; border: 3px solid rgb(255, 255, 255); border-radius: 50%; box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.15); }
.rp-img img { display: block; width: 100%; height: 100%; }
.rp-img2 img { display: block; width: 100%; height: 100%; }
.review-text-wrap { float: left; position: relative; z-index: 1; width: 100%; margin-right: -280px; }
.review-text { position: relative; margin-right: 280px; padding: 25px 30px; line-height: 22px; color: rgb(86, 80, 91); font-size: 19px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; border-radius: 4px; box-shadow: -1px 3px 3px rgba(0, 0, 0, 0.1); }
.review-text::before { content: ""; position: absolute; top: -12px; left: 30px; width: 34px; height: 26px; background: transparent url('../images/quote.png') no-repeat scroll 0% 0%; }
.review-text::after { content: ""; position: absolute; top: 50px; right: -65px; width: 65px; height: 55px; background: transparent url('../images/comment.png') no-repeat scroll 0% 0%; }
.review-text p { margin-bottom: 20px; }
.review-text p:last-child { margin-bottom: 0px; }
#screen3 { position: relative; margin-top: -80px; padding: 120px 0px 60px; background: rgb(224, 226, 230) url('../images/bg-three.jpg') repeat scroll 0% 0%; }
.it-looks { color: rgb(94, 99, 107); font-size: 22px; text-align: center; }
#three-pic { margin: 30px auto 0px; width: 795px; height: 308px; background: transparent url('../images/three.png') no-repeat scroll center top; }
#screen4 { padding: 60px 0px; background: rgb(233, 233, 235) url('../images/bg-four.jpg') repeat scroll 0% 0%; }
#four-pic { margin: 30px auto 0px; width: 795px; height: 695px; background: transparent url('../images/four-p.png') no-repeat scroll center top; }
#screen4 .review { margin-top: 50px; }
#screen5 { position: relative; z-index: 2; padding: 60px 0px; background: transparent radial-gradient(ellipse at center top , rgb(88, 20, 80) 0%, rgb(51, 20, 75) 60%) repeat scroll 0% 0%; }
#screen5 .title { color: rgb(255, 255, 255); }
#screen5 .review-people p { color: rgb(255, 255, 255); }
#screen5 .button { margin-top: 50px; }
#chamomile { position: relative; margin: 50px auto; width: 640px; height: 640px; }
.petal-center { position: absolute; display: table; z-index: 3; top: 50%; left: 50%; margin: -132px 0px 0px -132px; width: 256px; height: 256px; color: rgb(73, 66, 85); font-size: 28px; font-weight: 600; text-align: center; border: 4px solid rgb(235, 167, 62); border-radius: 50%; background: transparent radial-gradient(ellipse at center top , rgb(253, 253, 253) 0%, rgb(229, 229, 229) 60%) repeat scroll 0% 0%; box-shadow: 0px 0px 30px rgba(198, 102, 9, 0.6); }
.petal-center p { display: table-cell; vertical-align: middle; }
.petal { position: absolute; width: 220px; height: 220px; border-radius: 50%; background: rgba(255, 193, 4, 0.8) none repeat scroll 0% 0%; }
.petal p { width: 220px; height: 220px; border-radius: 50%; background: transparent radial-gradient(ellipse at center center , rgba(255, 130, 54, 0.6) 0%, rgba(255, 193, 4, 0.6) 100%) repeat scroll 0% 0%; }
.petal-name { position: absolute; z-index: 1; display: table; width: 220px; height: 220px; }
.petal-name p { display: table-cell; vertical-align: middle; width: 220px; height: 220px; color: rgb(255, 255, 255); text-align: center; font-size: 20px; font-weight: 600; text-shadow: 1px 1px 0px rgba(175, 96, 12, 0.75); }
.ptl1 { top: 0px; left: 50%; margin-left: -110px; }
.ptl2 { top: 25%; right: 25%; margin: -110px -110px 0px 0px; }
.ptl3 { top: 50%; right: 0px; margin-top: -110px; }
.ptl4 { bottom: 25%; right: 25%; margin: 0px -110px -110px 0px; }
.ptl5 { bottom: 0px; left: 50%; margin-left: -110px; }
.ptl6 { bottom: 25%; left: 25%; margin: 0px 0px -110px -110px; }
.ptl7 { top: 50%; left: 0px; margin-top: -110px; }
.ptl8 { top: 25%; left: 25%; margin: -110px 0px 0px -110px; }
.petal-name.ptl3 p { padding-left: 20px; }
.petal-name.ptl7 p { padding-right: 20px; }
#screen6 { padding: 60px 0px; background: rgb(235, 237, 241) url('../images/bg-six.jpg') repeat scroll 0% 0%; }
#screen6 .review { margin-top: 60px; }
#beauty-page { position: relative; margin: 0px 10px 80px; }
#beauty-page::before, #beauty-page::after { content: ""; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: rgb(255, 255, 255) none repeat scroll 0% 0%; box-shadow: 0px 0px 15px rgba(67, 69, 71, 0.1); }
#beauty-page::before { z-index: 2; transform: rotate(1deg); }
#beauty-page::after { z-index: 1; transform: rotate(-1deg); }
#beauty-content { position: relative; z-index: 3; padding: 50px 30px 0px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; box-shadow: 0px 0px 15px rgba(67, 69, 71, 0.1); }
#beauty-content .title { font-size: 25px; }
.advantages li { position: relative; float: left; margin-bottom: 50px; padding: 0px 3%; width: 44%; text-align: center; }
.advantages li:nth-child(2n+3) { clear: both; }
.advantages li p { margin-top: 15px; line-height: 23px; font-size: 19px; }
.advantages li p span { font-weight: 600; }
.do-img { height: 120px; background-position: center center; background-repeat: no-repeat; }
.do-first .do-img { height: 50px; }
.do1 .do-img { background-image: url('../images/do-1.png'); }
.do2 .do-img { background-image: url('../images/do-2.png'); }
.do3 .do-img { background-image: url('../images/do-3.png'); }
.do4 .do-img { background-image: url('../images/do-4.png'); }
.do5 .do-img { background-image: url('../images/do-5.png'); }
.do6 .do-img { background-image: url('../images/do-6.png'); }
.do7 .do-img { background-image: url('../images/do-7.png'); }
.do8 .do-img { background-image: url('../images/do-8.png'); }
#screen7 { padding: 60px 0px; background: rgb(52, 49, 92) url('../images/bg-seven.jpg') no-repeat scroll center bottom; }
#screen7 .title { color: rgb(255, 255, 255); }
.breview { padding: 40px 50px; }
.breview-people { float: left; width: 148px; height: 100%; text-align: center; }
.breview-photo { overflow: hidden; width: 140px; height: 140px; border: 4px solid rgb(255, 193, 4); border-radius: 50%; }
.breview-photo img { display: block; width: 100%; height: auto; }
.breview-logo { margin-top: 15px; }
.breview-logo img { display: block; margin-left: 5%; width: 90%; height: auto; }
.breview-text-wrap { float: right; width: 100%; margin-left: -190px; }
.breview-text { margin-left: 190px; }
.breview-name { margin-bottom: 10px; color: rgb(86, 81, 129); font-size: 20px; font-weight: 600; }
.breview-text p { margin-bottom: 20px; line-height: 22px; color: rgb(86, 80, 91); font-size: 19px; }
.breview-text p:last-child { margin-bottom: 0px; }
.breview-text .play { margin-bottom: 0px; }
#screen8 { padding: 60px 0px; background: rgb(255, 255, 255) url('../images/bg-eight.png') repeat scroll 0% 0%; }
#screen8 .button { margin-top: 0px; box-shadow: none; }
.all-logos li { float: left; margin: 10px 0px; width: 25%; text-align: center; }
.all-logos li p { margin: 0px auto; width: 200px; }
.all-logos li img { display: block; width: 100%; height: auto; }
#triangle { position: relative; margin: 40px 0px 50px; padding: 25px 20px 20px; color: rgb(109, 39, 5); font-size: 22px; font-weight: 600; text-align: center; background: rgb(255, 193, 4) none repeat scroll 0% 0%; }
#triangle::before { content: ""; position: absolute; top: 100%; left: 0px; width: 100%; height: 20px; background: transparent url('../images/triangle.png') no-repeat scroll center bottom; }
#now { margin-bottom: 30px; color: rgb(62, 53, 75); font-size: 22px; font-weight: 600; text-align: center; }
#screen9 { padding: 60px 0px; box-shadow: 0px 1px 15px rgba(0, 0, 0, 0.1) inset; background: rgb(245, 245, 245) url('../images/bg-two.jpg') no-repeat scroll center bottom; }
#screen9 .title { margin-bottom: 20px; font-size: 25px; }
#nine-left { float: left; width: 400px; }
#nine-right { float: right; width: 300px; }
#course { display: table; margin-top: 55px; height: 120px; line-height: 22px; color: rgb(62, 53, 75); font-size: 18px; text-align: center; background: transparent url('../images/course.png') no-repeat scroll center center; }
#course p { display: table-cell; vertical-align: middle; }
.vk-300px { position: absolute; top: -3000px; left: 0px; overflow: hidden; height: 10px; }
#foot { padding: 40px 0px 35px; font-size: 16px; background: rgb(50, 50, 59) none repeat scroll 0% 0%; }
#foot a { color: rgb(216, 216, 218); text-decoration: underline; }
#foot a:hover { color: rgb(255, 193, 4); }
.foot-col { float: left; width: 20%; }
.foot-col p { margin-bottom: 6px; color: rgb(255, 255, 255); }
.foot-col li { margin-bottom: 6px; }
.foot-title { margin-bottom: 12px; color: rgb(171, 171, 177); font-size: 16px; font-weight: 600; text-transform: uppercase; }
#social { padding: 15px 0px; background: rgb(40, 40, 48) none repeat scroll 0% 0%; }
#social .wrap { display: table; margin: 0px auto; }
#social p { float: left; margin-right: 10px; padding-top: 8px; color: rgb(171, 171, 177); font-size: 16px; font-weight: 600; text-transform: uppercase; }
#social-link { float: left; }
#social-link a { float: left; margin-left: 15px; width: 30px; height: 30px; background-color: rgb(195, 195, 195); background-image: url('../images/social.png'); background-repeat: no-repeat; border-radius: 3px; }
#social-link a:hover { background-color: rgb(255, 255, 255); }
.vk { background-position: 0px 0px; }
.fb { background-position: -30px 0px; }
.tw { background-position: -60px 0px; }
.yt { background-position: -90px 0px; }
.rss { background-position: -120px 0px; }
:first-child + html .arcticmodal-container { height: 100%; }
.popup-wrap { display: none; }
.popup-win { position: relative; width: 660px; }
.popup-win .button { margin-top: 25px; font-size: 21px; }
.arcticmodal-close { position: absolute; top: -25px; right: 0px; padding-left: 18px; color: rgb(255, 255, 255); font-size: 16px; font-weight: 600; text-transform: uppercase; cursor: pointer; border: 0px none; }
.arcticmodal-close::before { content: ""; position: absolute; top: 2px; left: 0px; width: 11px; height: 11px; background: transparent url('../images/close.png') no-repeat scroll 0% 0%; }
.arcticmodal-close:hover { color: rgb(255, 193, 4); }
.arcticmodal-close:hover::before { background-position: 0px -11px; }
.video-iframe { position: relative; padding-bottom: 55%; height: 0px; border: 4px solid rgb(255, 193, 4); }
.video-iframe iframe { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
@media screen and (min-width: 760px) {
.review-left .review-people { float: left; }
.review-left .review-text-wrap { float: right; margin-right: 0px; margin-left: -300px; }
.review-left .review-text { margin-right: 0px; margin-left: 300px; }
.review-left .review-text::after { left: -65px; right: auto; background: transparent url('../images/comment-left.png') no-repeat scroll 0% 0%; }
}
@media not all, not all, not all, not all {
.play { background-image: url('../images/play@2x.png'); background-size: 45px 135px; }
#head { background-image: url('../images/head@2x.jpg'); background-size: 1920px 786px; }
#logo { background-image: url('../images/logo@2x.png'); background-size: 190px 58px; }
#presentation { background-image: url('../images/play@2x.png'); background-size: 45px 135px; }
#presentation2 { background-image: url('../images/play@2x.png'); background-size: 45px 135px; }
#arrow { background-image: url('../images/arrow@2x.png'); background-size: 240px 90px; }
#screen2-body { background-image: url('../images/bg-two@2x.jpg'); background-size: 1920px 575px; }
#screen2::before { background-image: url('../images/head@2x.jpg'); background-size: 1920px 786px; }
#screen2::after { background-image: url('../images/bg-three-t@2x.png'); background-size: 1920px 100px; }
.review-text::before { background-image: url('../images/quote@2x.png'); background-size: 34px 26px; }
.review-text::after { background-image: url('../images/comment@2x.png'); background-size: 65px 55px; }
#screen3 { background-image: url('../images/bg-three@2x.jpg'); background-size: 100px 100px; }
#three-pic { background-image: url('../images/three@2x.png'); background-size: 795px 308px; }
#screen4 { background-image: url('../images/bg-four@2x.jpg'); background-size: 100px 100px; }
#four-pic { background-image: url('../images/four-p@2x.png'); background-size: 795px 650px; }
#screen6 { background-image: url('../images/bg-six@2x.jpg'); background-size: 476px 476px; }
.do1 .do-img { background-image: url('../images/do-1@2x.png'); background-size: 320px 50px; }
.do2 .do-img { background-image: url('../images/do-2@2x.png'); background-size: 320px 50px; }
.do3 .do-img { background-image: url('../images/do-3@2x.png'); background-size: 170px 120px; }
.do4 .do-img { background-image: url('../images/do-4@2x.png'); background-size: 170px 120px; }
.do5 .do-img { background-image: url('../images/do-5@2x.png'); background-size: 170px 120px; }
.do6 .do-img { background-image: url('../images/do-6@2x.png'); background-size: 170px 120px; }
.do7 .do-img { background-image: url('../images/do-7@2x.png'); background-size: 170px 120px; }
.do8 .do-img { background-image: url('../images/do-8@2x.png'); background-size: 170px 120px; }
#screen7 { background-image: url('../images/bg-seven@2x.jpg'); background-size: 1920px 1000px; }
#screen8 { background-image: url('../images/bg-eight@2x.png'); background-size: 12px 12px; }
#triangle::before { background-image: url('../images/triangle@2x.png'); background-size: 956px 20px; }
#screen9 { background-image: url('../images/bg-two@2x.jpg'); background-size: 1920px 575px; }
#course { background-image: url('../images/course@2x.png'); background-size: 101px 117px; }
#social-link a { background-image: url('../images/social@2x.png'); background-size: 150px 30px; }
.arcticmodal-close::before { background-image: url('../images/close@2x.png'); background-size: 11px 22px; }
}
@media screen and (max-width: 1020px), screen and (max-device-width: 1020px) {
#arrow { right: 40px; }
}
@media screen and (max-width: 920px), screen and (max-device-width: 920px) {
.title { margin-bottom: 30px; line-height: 30px; font-size: 26px; }
.add-title { margin: -20px 0px 30px; line-height: 24px; font-size: 21px; }
.button, .button-yel, .button-grey { font-size: 20px; }
.popup-win .button { font-size: 19px; }
#head { background-size: 1500px 614px; }
#head h1 { line-height: 40px; font-size: 36px; }
#main-text { margin-bottom: 40px; line-height: 22px; font-size: 20px; }
#arrow { right: 10px; width: 180px; }
#screen2::before { background-size: 1500px 614px; }
.review-text { padding: 20px; line-height: 20px; font-size: 17px; }
.review-text p { margin-bottom: 15px; }
#three-pic { margin: 20px auto 0px; width: 640px; height: 248px; background-size: 640px 248px; }
#four-pic { margin: 20px auto 0px; width: 640px; height: 523px; background-size: 640px 523px; }
#chamomile { margin: 30px auto 50px; width: 500px; height: 500px; }
.petal-center { margin: -99px 0px 0px -99px; width: 190px; height: 190px; font-size: 22px; }
.petal { width: 180px; height: 180px; }
.petal p { width: 180px; height: 180px; }
.petal-name, .petal-name p { width: 180px; height: 180px; font-size: 17px; }
.ptl1 { margin-left: -90px; }
.ptl2 { margin: -90px -90px 0px 0px; }
.ptl3 { margin-top: -90px; }
.ptl4 { margin: 0px -90px -90px 0px; }
.ptl5 { margin-left: -90px; }
.ptl6 { margin: 0px 0px -90px -90px; }
.ptl7 { margin-top: -90px; }
.ptl8 { margin: -90px 0px 0px -90px; }
.breview-text p { margin-bottom: 15px; line-height: 20px; font-size: 17px; }
.breview-name { font-size: 18px; }
.all-logos li p { width: 180px; }
}
@media screen and (max-width: 840px), screen and (max-device-width: 840px) {
.advantages li p { margin-top: 5px; line-height: 22px; font-size: 18px; }
.do1 .do-img, .do2 .do-img { height: 40px; background-size: 240px 37px; }
.do3 .do-img, .do3 .do-img, .do4 .do-img, .do5 .do-img, .do6 .do-img, .do7 .do-img, .do8 .do-img { height: 95px; background-size: 130px 92px; }
#foot { padding: 20px 0px 15px; }
.foot-col { margin-bottom: 25px; width: 25%; }
.foot-col:last-child { clear: both; float: none; margin-bottom: 0px; width: 100%; text-align: center; }
.foot-col:last-child br { display: none; }
}
@media screen and (max-width: 760px), screen and (max-device-width: 760px) {
#head { padding-top: 15px; background-position: center bottom -62px; }
#login a { font-size: 19px; }
#head h1 { padding-top: 40px; line-height: 36px; font-size: 30px; }
#main-text { margin-bottom: 30px; line-height: 20px; font-size: 18px; }
#arrow { display: none; }
#number { margin-top: 15px; line-height: 22px; font-size: 17px; }
#screen2 { margin-top: -30px; }
#screen2-body { padding: 90px 0px 50px; }
.review-people { float: none; display: table; margin-bottom: 30px; width: auto; height: 96px; text-align: left; }
.rp-img { float: left; margin: 0px; width: 90px; height: 90px; }
.review-people p { display: table-cell; vertical-align: middle; padding-left: 15px; font-size: 16px; }
.review-text-wrap { clear: both; float: none; width: 100%; margin-right: 0px; }
.review-text { position: relative; margin-right: 0px; }
.review-text p { margin-bottom: 10px; }
.review-text::before { top: -8px; left: 20px; width: 24px; height: 18px; background-size: 24px 18px; }
.review-text::after { top: -35px; right: auto; left: 85px; width: 48px; height: 40px; transform: rotate(-110deg); background-size: 48px 40px; }
#screen3 { margin-top: 0px; padding: 0px 0px 30px; }
.it-looks { font-size: 21px; }
#screen4 { padding: 30px 0px; }
#screen5 { padding: 30px 0px; }
#screen5 .button { margin-top: 30px; }
#screen6 { padding: 30px 0px 10px; }
#screen7 { padding: 30px 0px 10px; }
#screen7 .title { margin-bottom: 20px; }
.lSSlideOuter .lSPager.lSGallery { display: none; }
#screen8 { padding: 30px 0px; }
#screen8 .title { margin-bottom: 10px; }
.all-logos li { width: 33.33%; }
#screen9 { padding: 30px 0px; }
#nine-left { width: 300px; }
#nine-right { width: 280px; }
.vk-400px { display: none; }
.vk-300px { position: static; overflow: visible; height: auto; }
#course { font-size: 17px; height: auto; background-size: 70px 82px; }
}
@media screen and (max-width: 700px), screen and (max-device-width: 700px) {
.title { line-height: 26px; font-size: 22px; }
.add-title { margin: -20px 0px 20px; line-height: 21px; font-size: 18px; }
.button, .button-yel, .button-grey { padding: 12px 10px 8px; border-width: 2px !important; }
#head h1 { padding-top: 30px; line-height: 30px; font-size: 25px; }
#presentation { display: none; }
#presentation2 { display: table; }
.it-looks { font-size: 18px; }
#screen4 .review { margin-top: 30px; }
#beauty-content .title { font-size: 22px; }
#beauty-page { margin: -15px 0px 30px; }
#beauty-page::before, #beauty-page::after { display: none; }
#screen6 .review { margin-top: 30px; }
#beauty-content { padding: 20px 20px 0px; }
.advantages li p { line-height: 21px; font-size: 17px; }
.breview { padding: 20px 40px; }
#triangle { margin: 15px 0px 40px; padding: 15px 10px 5px; font-size: 20px; }
#now { margin-bottom: 20px; font-size: 20px; }
#screen9 .title { margin-bottom: 10px; font-size: 22px; }
.popup-win { width: 500px; }
}
@media screen and (max-width: 680px), screen and (max-device-width: 680px) {
#three-pic { margin: 10px auto 0px; width: 500px; height: 194px; background-size: 500px 194px; }
#four-pic { margin: 10px auto 0px; width: 500px; height: 408px; background-size: 500px 408px; }
}
@media screen and (max-width: 620px), screen and (max-device-width: 620px) {
.advantages li { margin-bottom: 30px; padding: 0px 2%; width: 96%; }
.advantages li p br { display: none; }
.breview { padding: 20px 30px; }
.breview-people { float: none; display: table; margin: 0px auto 15px; height: auto; }
.breview-photo { float: none; margin: 0px auto; width: 120px; height: 120px; }
.breview-logo { float: none; margin-top: 8px; }
.breview-text-wrap { float: none; clear: both; margin-left: 0px; }
.breview-text { margin-left: 0px; }
.all-logos li { width: 50%; }
#screen9 { padding: 40px 0px; }
#nine-left { float: none; display: table; margin: 0px auto; }
#nine-right { float: none; display: table; margin: 50px auto 0px; width: 300px; }
#course { margin: 0px; padding: 10px 0px; }
}
@media screen and (max-width: 540px), screen and (max-device-width: 540px) {
#three-pic { width: 360px; height: 139px; background-size: 360px 139px; }
#four-pic { margin: 10px auto 0px; width: 360px; height: 294px; background-size: 360px 294px; }
.lSSlideOuter .lSPager.lSGallery li { margin-top: 15px; }
.lSSlideOuter .lSPager.lSGallery li .lS-photo { width: 76px; height: 76px; }
.lSSlideOuter .lSPager.lSGallery li p { padding: 10px 6px 0px; font-size: 15px; }
#triangle { margin: 15px 0px 35px; padding: 10px 8px 0px; font-size: 18px; }
#now { margin-bottom: 15px; font-size: 18px; }
#foot .wrap { padding: 0px 5px; }
.foot-col { width: 50%; }
.foot-col:last-child { width: 100%; }
.foot-col:last-child br { display: block; }
#social p { float: none; margin: 0px 0px 10px; padding: 0px; text-align: center; }
#social-link a:first-child { margin-left: 0px; }
.popup-win { width: 400px; }
.popup-win .button { margin-top: 15px; }
}
@media screen and (max-width: 520px), screen and (max-device-width: 520px) {
#chamomile { margin-bottom: 30px; width: 300px; height: 580px; }
.petal-center { top: 0px; margin: 0px 0px 0px -84px; width: 160px; height: 160px; }
.petal { width: 160px; height: 160px; }
.petal p { width: 160px; height: 160px; }
.petal-name, .petal-name p { width: 160px; height: 160px; font-size: 16px; font-weight: 400; }
.ptl1, .ptl2, .ptl3, .ptl4, .ptl5, .ptl6, .ptl7, .ptl8 { margin: 0px; }
.ptl1 { top: 120px; left: 0px; }
.ptl2 { top: 120px; right: 0px; }
.ptl3 { top: 220px; left: 0px; }
.ptl4 { top: 220px; right: 0px; }
.ptl5 { top: 320px; left: 0px; }
.ptl6 { top: 320px; right: 0px; left: auto; }
.ptl7 { top: 420px; left: 0px; }
.ptl8 { top: 420px; right: 0px; left: auto; }
.petal-name.ptl3 p, .petal-name.ptl7 p { padding: 0px; }
}
@media screen and (max-width: 460px), screen and (max-device-width: 460px) {
.title { line-height: 24px; font-size: 20px; }
.title br { display: none; }
.add-title { margin: -25px 0px 20px; line-height: 19px; font-size: 18px; }
.add-title br { display: none; }
.button, .button-yel, .button-grey { line-height: 21px; font-size: 18px; }
#presentation { padding: 0px; width: 45px; }
#presentation p { display: none; }
#login a:last-child::before { top: 0px; height: 18px; }
#head h1 { padding-top: 15px; line-height: 25px; font-size: 20px; }
#main-text { margin-top: 10px; margin-bottom: 20px; line-height: 18px; font-size: 16px; }
#screen2-body { padding-bottom: 40px; }
#beauty-content .title { font-size: 20px; }
.review-people { height: 76px; }
.rp-img { width: 70px; height: 70px; }
.review-text { padding: 15px; line-height: 19px; font-size: 16px; }
.review-text::after { left: 60px; }
.play { font-size: 17px; }
.all-logos li p { width: 140px; }
#screen9 .title { font-size: 20px; }
}
@media screen and (max-width: 420px), screen and (max-device-width: 420px) {
#logo { width: 142px; height: 44px; background-size: 130px 40px; }
#login { margin-top: 12px; }
#login a { font-size: 17px; }
#login a:last-child { margin-left: 25px; }
#login a:last-child::before { left: -13px; }
.popup-win { width: 310px; }
}
@media screen and (max-width: 380px), screen and (max-device-width: 380px) {
#three-pic { width: 350px; height: 136px; background-size: 350px 136px; }
#four-pic { width: 350px; height: 286px; background-size: 350px 286px; }
}
@media screen and (max-width: 360px), screen and (max-device-width: 360px) {
#three-pic { width: 320px; height: 124px; background-size: 320px 124px; }
#four-pic { width: 320px; height: 262px; background-size: 320px 262px; }
}
/* ::::: https://yagla.ru/css/lightslider.css ::::: */
.lSSlideOuter { overflow: hidden; -moz-user-select: none; }
.lightSlider::before, .lightSlider::after { content: " "; display: table; }
.lightSlider { overflow: hidden; margin: 0px; }
.lSSlideWrapper { max-width: 100%; overflow: hidden; position: relative; background: rgb(255, 255, 255) none repeat scroll 0% 0%; }
.lSSlideWrapper > .lightSlider::after { clear: both; }
.lSSlideWrapper .lSSlide { transform: translate(0px, 0px); transition-delay: 0s; transition-property: transform, height; transition-duration: inherit !important; transition-timing-function: inherit !important; }
.lSSlideOuter .lSPager.lSGallery { padding-left: 0px; margin: 0px; overflow: hidden; transform: translate3d(0px, 0px, 0px); transition-property: -moz-transform; -moz-user-select: none; }
.lSSlideOuter .lSPager.lSGallery li { margin-top: 30px; overflow: hidden; opacity: 0.6; text-align: center; }
.lSSlideOuter .lSPager.lSGallery li.active .lS-photo { border: 3px solid rgb(255, 193, 4); }
.lSSlideOuter .lSPager.lSGallery li.active, .lSSlideOuter .lSPager.lSGallery li:hover { opacity: 1; }
.lSSlideOuter .lSPager.lSGallery li p { padding: 12px 10px 0px; color: rgb(255, 255, 255); font-size: 16px; }
.lSSlideOuter .lSPager.lSGallery li .lS-photo { display: block; margin: 0px auto; overflow: hidden; width: 96px; height: 96px; border: 3px solid transparent; border-radius: 50%; }
.lSSlideOuter .lSPager.lSGallery img { display: block; max-width: 100%; height: auto; }
.lSSlideOuter .lSPager.lSGallery::before, .lSSlideOuter .lSPager.lSGallery::after { content: ""; display: table; }
.lSSlideOuter .lSPager.lSGallery::after { clear: both; }
.lSAction::before, .lSAction::after { content: ""; position: absolute; z-index: 1; top: 0px; width: 30px; height: 100%; background: rgb(255, 255, 255) none repeat scroll 0% 0%; }
.lSAction::before { left: 0px; }
.lSAction::after { right: 0px; }
.lSAction > a { position: absolute; z-index: 99; top: 0px; width: 25px; height: 100%; cursor: pointer; }
.lSAction > a.lSPrev::before, .lSAction > a.lSNext::before { content: ""; position: absolute; top: 50%; left: 0px; margin-top: -40px; width: 25px; height: 180px; background-image: url('../images/navi.png'); background-repeat: no-repeat; }
.lSAction > a.lSPrev { left: 0px; }
.lSAction > a.lSPrev::before { background-position: 0px 0px; }
.lSAction > a.lSPrev:hover::before { background-position: 0px -80px; }
.lSAction > a.lSNext { right: 0px; }
.lSAction > a.lSNext::before { background-position: -25px 0px; }
.lSAction > a.lSNext:hover::before { background-position: -25px -80px; }
.lSSlideOuter .lightSlider, .lSSlideOuter .lSPager { padding-left: 0px; list-style: outside none none; }
.lSSlideOuter .lightSlider > *, .lSSlideOuter .lSGallery li { float: left; }
@media not all, not all, not all, not all {
.lSAction > a.lSPrev::before, .lSAction > a.lSNext::before { background-image: url('../images/navi@2x.png'); background-size: 50px 160px; }
}
/* ::::: https://cloud.roistat.com/dist/module.css?32 ::::: */
#supportTrigger #supportNewMessageBadge { display: none; position: absolute; background: rgb(255, 108, 96) none repeat scroll 0% 0%; color: rgb(255, 255, 255); width: 21px; height: 21px; line-height: 19px; z-index: 3; border-radius: 50%; font-size: 14px; animation: 10s ease 0s normal none infinite running support-badge; text-align: center; top: 50%; left: -25px; margin-top: -10.5px; border: 1px solid rgb(235, 88, 76); }
#supportTrigger { display: block; cursor: pointer; z-index: 2147483646; margin: 0px; padding: 0px; -moz-text-size-adjust: auto; }
#supportTrigger.support-trigger-transition { transition: all 0.2s linear 0s; }
#supportTrigger > * { box-sizing: border-box !important; transition: opacity 0.3s ease 0s; }
#supportTrigger * { margin: 0px; padding: 0px; }
#supportTrigger.support-trigger-offline .support-trigger-mode-online { display: none !important; }
#supportTrigger .support-trigger-text-wrapper { background-color: rgb(138, 138, 138); padding: 0.5em 1em; border-radius: 3px 3px 0px 0px; font-size: 15px; font-family: Arial,Helvetica,sans-serif; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2); border-top: 0px solid rgb(118, 118, 118); }
#supportTrigger span.support-icon + span, #supportTrigger span.support-icon + span + span { padding-left: 0.9em; }
#supportTrigger .support-trigger-text-inner { display: table; white-space: nowrap; }
#supportTrigger .support-trigger-text-inner > span.support-icon { text-align: center; padding: 0px 0px 0.3em; }
#supportTrigger .support-trigger-text-inner > span.support-icon::before { font-size: 1.5em; }
#supportTrigger .support-trigger-text-inner > span { color: rgb(255, 255, 255); font-family: Arial,Helvetica,sans-serif; font-size: 15px; vertical-align: middle; display: table-cell !important; }
#supportTrigger { position: fixed; bottom: 0px; right: 100px; }
@font-face {
font-family: "supportIconFont";
font-style: normal;
font-weight: normal;
src: url('../images/undefined') format("embedded-opentype"), url('../images/undefined') format("truetype"), url('../images/undefined') format("woff"), url('../images/undefined') format("svg");
}
[class^="support-icon-"]::before, [class*=" support-icon-"]::before { font-family: "supportIconFont" !important; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; }
[class^="support-icon-"], [class*=" support-icon-"] { width: auto !important; height: auto !important; background: transparent none repeat scroll 0% 0% !important; }
.support-icon-chevron-up::before { content: ""; }
.support-icon-chevron-down::before { content: ""; }
.support-icon-comments-o::before { content: ""; }
html { min-height: 100%; }
.support-unselectable { -moz-user-select: none; }
#onlineSupportContainer { transition: opacity 0.2s linear 0s; }
#onlineSupportContainer, #onlineSupportContainer *::-moz-selection { background: transparent none repeat scroll 0% 0%; }
#onlineSupportContainer iframe, .phonebookSubscribe iframe, .meTalkForm iframe, #onlineSupportReviews iframe { max-height: none !important; }
.table-responsive{
padding-top:30px;
padding-bottom:80px;
}
.table-responsive .table td {
border:2px solid rgb(94, 99, 107);
text-align:center;
vertical-align:middle;
}