/*
Theme Name: Taro Theme
Theme URL: tarot-freud.ru
Description: Taro minimal theme
Author: Arseny Smirnov
Version: 1.0 
*/

.intro-area {
    background: url(img/taro-bg.jpg)no-repeat;
}

.footer-area ul,.intro-area,.navbar-list,.row,.site-navbar{
    display:flex;
    justify-content:space-between;
    align-items:flex-start
}

.divider { display:none; }

.site-navbar{
    align-items: center;
}

.socials {
    display: flex;
    align-items: center;
}

.socials .version {
    display: flex;
    align-items: center;
    margin-right: 24px;
}

.socials .version img {
    max-width: 32px;
    border-radius: 50%;
    margin-right: 8px;
}

.socials .version span {
    color: #333;
}

.socials img {
    max-width: 48px;
}

h1,h2{
    font-family:Verdana,helvetica,Sans-Serif;
    font-weight:400;
    font-size:46px;
    line-height:1.2;
    margin:24px 0 0 -5px
}

h1 {
	font-size:22px;
}

.navbar-list-parent { display: flex; }

.navbar-list .sublist { display:none; }
.navbar-list .sublist.opened { 
    position: absolute;
    left: 0;
    width: 100%;
    min-width: 280px;
    top: 52px;
    display: block;
    background: #fff;
    padding: 20px;
    box-shadow: 0 0 10px rgba(0,0,0,.1);
    border-radius: 10px;
}


/* h1::first-letter,h2::first-letter{
    float:left;
    margin:-17px -3px 0 0;
    font-size:1.6em;
    font-weight:400
} */
@-moz-document url-prefix(){
    h1::first-letter,h2::first-letter{
        margin-top:-10px
    }
}
p{
    margin:0 0 25px;
    font-size:1rem;
    line-height:1.5
}
.subtitle{
    margin:20px 0 20px 0px;
    font-family:Verdana,serif;
    font-weight:400;
    font-size:26px;
    line-height:1.2;
}
.title-decor{
    position:relative;
    display:inline-block;
    margin:0 0 10px 18px;
    font-family:Verdana,serif;
    font-size:90px;
    color:rgba(0,0,0,.1)
}
.title-decor:after{
    position:absolute;
    top:72%;
    left:50%;
    content:'';
    width:1px;
    height:60px;
    background-color:rgba(0,0,0,.1)
}
.title-decor.modif{
    min-height:105px;
    margin-bottom:32px
}
.title-decor.modif:after{
    top:78%
}
html{
    scroll-behavior:smooth;
    box-sizing:border-box;
    font-size:15px
}
*{
    scroll-behavior:smooth
}
*,:after,:before{
    box-sizing:inherit
}
body{
    margin:0;
    font-size:1rem;
    font-family:Verdana,sans-serif;
    line-height:1.7;
    color:rgba(0,0,0,.9);
    background-color:#fff;
    width:100%;
    overflow-x:hidden
}
a{
    color:#7837b0;
    text-decoration:none
}
a:focus,a:hover{
    color:#9151c9
}
a,button{
    outline:0
}
button{
    cursor:pointer
}
ol,ul{
    list-style:none
}
img{
    max-width:100%;
    -webkit-user-select:none;
    -ms-user-select:none;
    user-select:none;
    -webkit-user-drag:none
}
label{
    display:block
}
input[type=email],input[type=password],input[type=search],input[type=tel],input[type=text],textarea{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none
}
input[type=email]::-webkit-input-placeholder,input[type=password]::-webkit-input-placeholder,input[type=search]::-webkit-input-placeholder,input[type=tel]::-webkit-input-placeholder,input[type=text]::-webkit-input-placeholder,textarea::-webkit-input-placeholder{
    color:#666
}
input[type=email]::-moz-placeholder,input[type=password]::-moz-placeholder,input[type=search]::-moz-placeholder,input[type=tel]::-moz-placeholder,input[type=text]::-moz-placeholder,textarea::-moz-placeholder{
    color:#666
}
input[type=email]:-ms-input-placeholder,input[type=password]:-ms-input-placeholder,input[type=search]:-ms-input-placeholder,input[type=tel]:-ms-input-placeholder,input[type=text]:-ms-input-placeholder,textarea:-ms-input-placeholder{
    color:#666
}
input[type=email]:-moz-placeholder,input[type=password]:-moz-placeholder,input[type=search]:-moz-placeholder,input[type=tel]:-moz-placeholder,input[type=text]:-moz-placeholder,textarea:-moz-placeholder{
    color:#666
}
textarea{
    resize:vertical;
    min-height:160px
}
iframe{
    width:100%
}
footer,header,section{
    display:block;
    width:100%;
    height:auto;
    overflow:hidden
}
.container{
    width:calc(100% - 80px);
    max-width:1260px;
    margin:0 auto
}
.half-row{
    width:48.33%
}
aside{
    width:31.11%
}
article{
    width:100%
}
.fullpage-loader{
    position:fixed;
    top:0;
    left:0;
    height:100vh;
    width:100vw;
    overflow:hidden;
    background:#fff;
    z-index:9999;
    opacity:1;
    transition:opacity .5s;
    display:flex;
    justify-content:center;
    align-items:center
}
.fullpage-loader--invisible{
    opacity:0
}
.wrapper{
    position:relative
}
.wrapper .wrapper-aside{
    position:absolute;
    top:100px;
    max-width:45%
}
.wrapper .wrapper-aside.left{
    left:0
}
.wrapper .wrapper-aside.right{
    right:0
}
.btns-block{
    display:flex;
    margin:45px 0 0;
    padding: 20px 0;
}

.icon {
    width: 52px;
    height: 52px;
    margin-right: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.icon:last-child {
    margin-right: 0!important;
}

.icon a {
    display: flex!important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.icon.tg { background: #07a4e2; }
.icon.wa { background: #67c15e; }
.icon.yt { background: #db0812; }
.icon.inst { background: #fff; }

.icon img { width: 40px; }
.icon.wa img { width: 30px; }
.icon.tg img { width: 30px; }
.icon.inst img { width: 30px; }

.socials .icon { margin-right: 12px; width: 42px; height: 42px; }
.socials .icon.tg img { width: 26px; }
.socials .icon.wa img { width: 26px; }


.btn{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    display:inline-block;
    border-radius:40px;
    padding:20px 40px;
    font-size:20px;
    font-weight:500;
    white-space:nowrap;
    text-align:center;
    text-decoration:none;
    cursor:pointer;
    transition:all .2s ease-out
}
.default{
    background:0 0;
    border:2px solid #ffda17;
    color:#333;
}
.primary{
    background:#ffda17;
    color:#333;
    border:none
}

.default:hover,.primary:hover,.altered{
    background:#6c4b87;
    color:#fff
}
.top-link{
    transition:all .25s ease-in-out;
    position:fixed;
    z-index:100;
    bottom:0;
    right:0;
    display:inline-flex;
    cursor:pointer;
    align-items:center;
    justify-content:center;
    margin:0 3em 3em 0;
    border-radius:50%;
    padding:.25em;
    width:56px;
    height:56px;
    background-color:rgba(0,0,0,.03)
}
.top-link.show{
    visibility:visible;
    opacity:1
}
.top-link.hide{
    visibility:hidden;
    opacity:0
}
.top-link img{
    width:auto;
    height:26px;
    filter:grayscale(4);
    opacity:.5;
    transition:all .25s ease-in-out
}
.top-link:hover{
    background-color:rgba(118,82,149,.1)
}
.top-link:hover img{
    filter:grayscale(0);
    opacity:1
}
.screen-reader-text{
    position:absolute;
    -webkit-clip-path:inset(50%);
    clip-path:inset(50%);
    margin:-1px;
    border:0;
    padding:0;
    width:1px;
    height:1px;
    overflow:hidden;
    word-wrap:normal!important;
    clip:rect(1px,1px,1px,1px)
}
.screen-reader-text:focus{
    display:block;
    top:5px;
    left:5px;
    z-index:100000;
    -webkit-clip-path:none;
    clip-path:none;
    background-color:#eee;
    padding:15px 23px 14px;
    width:auto;
    height:auto;
    text-decoration:none;
    line-height:normal;
    color:#444;
    font-size:1em;
    clip:auto!important
}

.tel{
    background:url(img/telegram.svg) left top 4px no-repeat;
    background-size:34px auto
}
.area-header{
    margin-bottom: 64px;
}
.photogallery a{
    position:relative;
    display:block
}

.fancybox-content {
    background: none!important;
}

.form-control{
    width:100%;
    margin-bottom:20px;
    padding:10px 0;
    border:none;
    border-bottom:1px solid rgba(0,0,0,.2);
    border-radius:0;
    background-color:transparent;
    font-family:Verdana,sans-serif;
    font-size:1.1rem
}
.form-control:focus{
    outline:1px solid #c29fe1
}
.form-control.error{
    border-bottom:1px solid red
}
.smaller-text{
    font-size:.85rem
}
.noscroll,.popup-bottom{
    width:100%;
    height:100%;
    position:fixed;
    overflow:hidden
}
.noscroll::after{
    content:'';
    position:fixed;
    top:120px;
    left:0;
    width:100%;
    height:calc(100% - 120px);
    background-color:#fff
}
.popup-bottom{
    padding-right:17px
}
.body-blackout{
    position:fixed;
    z-index:1010;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0);
    pointer-events:none
}
.body-blackout.is-blacked-out{
    background-color:rgba(0,0,0,.65);
    pointer-events:auto
}
.popup-modal{
    width:90%;
    max-width:750px;
    height:85vh;
    max-height:600px;
    border-radius:12px;
    background-color:#fff;
    position:fixed;
    left:50vw;
    top:50%;
    transform:translate(-50%,-50%);
    padding:45px 23px 45px 45px;
    opacity:0;
    pointer-events:none;
    transition:all .3s ease-in-out;
    z-index:1011
}
.popup-modal.is--visible{
    opacity:1;
    pointer-events:auto
}
.popup-modal__close{
    position:absolute;
    font-size:1.2rem;
    right:-10px;
    top:-10px;
    cursor:pointer
}
.popup-modal .popup-modal__close{
    position:absolute;
    top:15px;
    right:15px;
    width:26px;
    height:26px;
    text-align:center;
    padding-right:2px;
    font-family:'Times New Roman';
    font-size:3rem;
    font-weight:300;
    line-height:.4;
    -webkit-user-select:none;
    -ms-user-select:none;
    user-select:none
}
.popup-modal .popup-modal__content{
    width:100%;
    height:100%;
    overflow-y:scroll;
    padding-right:35px;
    font-size:.9rem
}
.popup-modal .popup-modal__content p{
    font-size:.9rem
}
.popup-modal .popup-modal__content ol,.popup-modal .popup-modal__content ul{
    padding-left:20px
}
.popup-modal .popup-modal__content li{
    list-style:disc;
    margin-bottom:13px;
    line-height:1.4
}
.popup-modal .popup-modal__content::-webkit-scrollbar{
    width:8px!important;
    background-color:#f5f5f5
}
.popup-modal .popup-modal__content::-webkit-scrollbar-thumb{
    border-radius:4px;
    -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.1);
    background-color:#ada8be
}
.popup-modal .popup-modal__content::-webkit-scrollbar-track{
    border-radius:4px;
    -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.1);
    background-color:#f5f5f5
}
.separator{
    position:relative;
    top:2px;
    width:1px;
    height:40px;
    /* background-color:rgba(255,255,255,.25) */
}
.splide__arrow{
    top:-88px;
    width:35px;
    height:21px;
    border-radius:0;
    background-color:transparent;
    filter:grayscale(1) brightness(0)
}
.splide__arrow svg{
    display:none
}
.splide__arrow:hover{
    filter:grayscale(0) brightness(1)
}
.splide__arrow--prev{
    left:calc(100% - 120px)
}
.splide__arrow--prev:after{
    position:absolute;
    left:0;
    top:0;
    content:'';
    width:35px;
    height:21px;
    background:url(img/arrow.svg);
    background-size:35px 21px
}
.splide__arrow--next:after{
    position:absolute;
    left:0;
    top:0;
    content:'';
    width:35px;
    height:21px;
    background:url(img/arrow.svg);
    background-size:35px 21px;
    transform:rotate(180deg)
}
.lg-sub-html{
    letter-spacing:1px;
    line-height:1.3
}
.animated{
    animation-duration:.5s;
    animation-fill-mode:both;
    animation-timing-function:cubic-bezier(.215,.61,.355,1)
}
[data-animation]{
    opacity:0
}
.animated.delay-05s{
    animation-delay:.3s
}
.animated.delay-1s{
    animation-delay:1s
}
.animated.delay-15s{
    animation-delay:1.5s
}
.animated.slow{
    animation-duration:2s
}
.showFromLeft{
    animation-name:showFromLeft
}
@keyframes showFromLeft{
    0%{
        opacity:0;
        transform:translate3d(-200px,0,0)
    }
    100%{
        opacity:1;
        transform:translate3d(0,0,0)
    }
}
.showFromRight{
    animation-name:showFromRight
}
@keyframes showFromRight{
    0%{
        opacity:0;
        transform:translate3d(200px,0,0)
    }
    100%{
        opacity:1;
        transform:translate3d(0,0,0)
    }
}
.showFromBottom{
    animation-name:showFromBottom
}
@keyframes showFromBottom{
    0%{
        opacity:0;
        transform:translate3d(0,100px,0)
    }
    100%{
        opacity:1;
        transform:translate3d(0,0,0)
    }
}
.showFade{
    animation-name:showFade
}
@keyframes showFade{
    0%{
        opacity:0
    }
    100%{
        opacity:1
    }
}
.flipButton{
    text-align:center
}
.flip-container{
    perspective:1000
}
.flip-container.hover .flipper{
    transform:rotateY(180deg)
}
.back,.flip-container,.front{
    width:251px;
    height:436px
}
.back img,.front img{
    display:block;
    width:100%;
    height:100%
}
.flipper{
    transition:.5s;
    transform-style:preserve-3d;
    position:relative
}
.back,.front{
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    position:absolute;
    top:0;
    left:0;
    z-index:2
}
.back{
    transform:rotateY(180deg)
}
@-moz-document url-prefix(){
    .front{
        transition:opacity .5s ease
    }
    .flip-container.hover .front{
        opacity:0
    }
}
.site-navbar{
    padding-top:25px
}
.site-logo{

}
.site-logo img{
    width:300px;
    height:auto
}

.site-logo-tagline{
    margin:-22px 0 0 59px;
    font-family:Verdana,serif;
    font-family:Georgia,serif;
    font-style:italic;
    font-size:13px;
    font-weight:400;
    line-height:1.2;
    color:rgba(118,82,149,.85);
    text-rendering:optimizeLegibility
}
.site-logo-tagline span{
    display:block
}

.navbar-area {
    position: fixed;
    left: 0;
    width: 100%;
    top: 0;
    z-index: 999;
    background: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,.2);
}

.navbar-list{
    margin:0;
    padding:0;
    list-style:none;
    flex-wrap:wrap;
    /* border-bottom:1px solid rgba(0,0,0,.1) */
}



.navbar-list li{
    margin-right:40px;
    position: relative;
}

.navbar-list li:last-child{
    margin-right: 0;
}

.navbar-list li a{
    padding:3px 0;
    display:block;
    font-size:1.05rem;
    color:#000;
}
.navbar-list li a:hover{
    color:#7837b0
}
.nav-toggler{
    margin-top:11px;
    border:1px solid rgba(0,0,0,.03);
    padding:5px;
    background-color:transparent;
    cursor:pointer;
    height:39px;
    display:none
}
.nav-toggler span,.nav-toggler span:after,.nav-toggler span:before{
    width:28px;
    height:3px;
    background-color:#555;
    display:block;
    transition:.3s
}
.nav-toggler span:before{
    content:'';
    transform:translateY(-9px)
}
.nav-toggler span:after{
    content:'';
    transform:translateY(6px)
}
.nav-toggler.toggler-open span{
    background-color:transparent
}
.nav-toggler.toggler-open span:before{
    transform:translateY(0) rotate(45deg)
}
.nav-toggler.toggler-open span:after{
    transform:translateY(-3px) rotate(-45deg)
}

@keyframes slidein {
    0% {
        transform: translateY(0);
        filter: grayscale(50);
    }
    50% {
        transform: translateY(20px);
        filter: grayscale(0);
    }
    100% {
        transform: translateY(0);
        filter: grayscale(50);
    }
}
  

.intro-area{
    background: #eee;
    align-items:center;
    position: relative;
    background-image: url(img/first-before-2.png), url(img/first-after.webp);
    background-position: -140px center, 86% center;
    background-repeat: no-repeat, no-repeat;
    margin-top: 108px;
}

.intro-area .with-bg {
    background: no-repeat;
    background-position: 0 center;
    position: relative;
    z-index: 4;
    height:680px;
    width: 28.33%;
}

.intro-area .with-bg img {
    max-height: 640px;
    position: absolute;
    bottom: 0;
}

.intro-area .without-bg {
    position: relative;
    z-index: 3;
    padding-top: 96px;
	width:80%;
    /*width: 68.33%;*/
}

/* .intro-area:after {
    position: absolute;
    left: 27%;
    top: 25%;
    content: url(img/first-after.png);
    animation: slidein 2s infinite ease-in-out;
} */

.intro-area .subtitle{
    font-size:32px;
    margin:0 0 30px 0;
    position: relative;
}

.intro-area h1{
    margin:0 0 30px;
    /*border-top: 2px #333 solid;*/
    padding-top: 12px;
}
.intro-area p{
    font-size:1.3rem;
    margin-bottom:30px;
    max-width:75%;
}
.about-area{
}

.about-area .row{
    min-height:630px
}
#certificate a picture{
    display:block;
    width:100%;
    height:auto;
    line-height:0
}
#certificate a img{
    display:block;
    width:100%;
    height:auto
}
.service-area{
    margin:15px 0 90px
}
.service-area .row{
    min-height:480px
}
.service-area .subtitle{

}
.service-area .btns-block+p{
    margin:20px 0 0 10px;
    font-size:1.3rem
}
.intro-area .btn,.service-area .btn{
    margin-right:20px
}

.intro-area .btn,.service-area .btn.tg-link { background: #07a4e2!important; color: #fff!important; }
.intro-area .btn,.service-area .btn.wa-link { background: #67c15e!important; color: #fff!important; }

.reviews-area{
    margin-top:-80px;
    padding-bottom:50px
}
.reviews-area .btns-block{
    padding:0 15%
}
.reviews-area .btns-block p{
    display:inline-block;
    vertical-align:middle;
    width:calc(100% - 225px);
    margin:0;
    padding-right:40px;
    font-size:.95rem
}
#reviews .review{
    margin:0 10px;
    min-height:420px;
    padding:35px 12%;
    border-radius:10px;
    background-color:rgba(0,0,0,.08)
}
#reviews .review .review-author{
    display:inline-block
}
#reviews .review .review-author:before{
    display:inline-block;
    content:'\2711';
    font-size:2rem;
    transform:rotate(35deg) translate(0,2px)
}
#reviews .review .review-author span{
    font-family:Verdana,serif;
    font-size:1.9rem;
    font-weight:600;
    margin-right:4px
}
#reviews .review .review-author:after{
    display:inline-block;
    content:'';
    width:65px;
    height:1px;
    background-color:rgba(0,0,0,.4);
    margin-left:6px
}
#reviews .review .review-date{
    display:inline-block
}
#reviews .review p{
    margin:25px 0 20px
}
.faq-area{
    margin:25px 0 0
}
.faq-area .faq-block{
    margin-top: 64px;
    padding:60px 10%;
    border-radius:14px;
    background:#eee;
    background-size:cover
}
.faq-area .faq-block>div{
    border-bottom:1px solid rgba(0,0,0,.2)
}
.faq-area .question{
    position:relative;
    margin:0;
    padding:24px 70px 24px 0;
    display:block;
    width:100%;
    overflow:hidden;
    font-size:1.3rem;
    font-weight:700;
    line-height:1.3;
    cursor:pointer
}
.faq-area .question .plus{
    position:absolute;
    top:calc(50% - 14px);
    margin-left:calc(100% - 50px);
    z-index:5;
    font-family:'Times New Roman';
    font-size:2rem;
    font-weight:300;
    line-height:100%;
    -webkit-user-select:none;
    -ms-user-select:none;
    user-select:none;
    transition:.3s ease
}
.faq-area .answer{
    position:relative;
    max-height:0;
    overflow:hidden;
    opacity:0;
    transition:all .4s
}
.faq-area .answer p{
    position:relative;
    margin-bottom:15px;
}

/* .faq-area .answer p:before{
    position:absolute;
    top:-10px;
    left:90px;
    content:'';
    width:1px;
    height:0;
    background-color:rgba(0,0,0,.1);
    transition:.5s ease
} */
.faq-area input:checked~.answer{
    opacity:1;
    max-height:none
}

.faq-area input:checked~.question .plus{
    transform:rotate(45deg)
}
.faq-area input{
    position:absolute;
    opacity:0;
    z-index:-1
}

#price .row {
    margin: 64px 0;
    border-radius: 20px;
}

#price .row h4 {
    font-size: 24px;
    margin-bottom: 16px;
    position: relative;
    z-index: 2;
}

#price .row .titled:first-child h4 {
    font-size: 28px;
    line-height: 1.35;
    max-width: 55%;
}

#price .row .titled {
    display: flex;
    position: relative;
    justify-content: space-between;
    background: #f5f5f5;
    padding: 30px;
    margin-bottom: 64px;
    border-radius: 20px;
}

#price .row .titled::after {
    /* content: ''; */
    width: 100px;
    height: 4px;
    border-radius: 20px;
    background: #ffc600;
    position: absolute;
    left: 0;
    top: 40px;
    z-index: 0;
  }

#price .row p, #price .row li {
    margin-bottom: 4px; 
    position: relative;
}

#price .row li {
    display:block;
    list-style: none;
}

/* #price .row li::before {
    left: 0;
    top: 0px;
    content: '✡︎';
    position: absolute;
} */

#price .row p.bordered {
    margin-bottom: 12px;
    padding: 20px;
    border-radius: 20px;
    /* border-bottom: 1px #eee solid; */
}

#price ul {
    padding-left: 0;
    display: block;
    flex-wrap: wrap;
}

#price ul.mini {
	display: flex;
}

#price ul.mini li {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    width: 30%;
}

#price ul.mini li p {
    font-size: 16px;
	max-width: 200px;
}

.mini li img {
    max-width: 100px!important;
    margin-right: 16px;
    position: static!important;
    right: auto!important;
    filter: grayscale(50%);
    border-radius: 10px;
}

#price .row .full-row.bordered {
    padding: 30px;
    border: 1px #eee solid;
    border-radius: 20px;
    /* border: 1px solid #ffda17; */
    padding: 42px;
    position: relative;
    /* backdrop-filter: blur(96px); */
    position: relative;
    background: rgba(255,255,255,.96);
    /* box-shadow: 10px 20px 40px rgba(0,0,0,.06); */
    width: 100%;
    margin: 0 auto;
}

#price .row .full-row.bordered img {
    display: block;
    max-width: 35%;
    position: absolute;
    right: 0;
    top: -90px;
    z-index: 3;
	max-height: 380px;
}

#price .row .full-row.bordered .titled:after {
    position: absolute;
    width: 100px;
    height: 100px;
    top: -30px;
    border-radius: 50%;
    background: #f5f5f5 url(img/taro-icon.png)no-repeat;
    background-size: 64px;
    background-position: center;
    content: '';
    left: -10px;
}

#price .row .full-row.bordered b.toggler {
    display: block;
}

.course-title {
    font-size: 19px;
    font-weight: bold;
    margin-bottom: 16px;
    cursor: pointer;
    padding: 20px;
    border-radius: 20px;
}

#price .row .full-row.bordered span {
    display: none;
}

#price .row .full-row.bordered .togglable b, .course-title i {
    cursor: pointer;
    position: relative;
    padding-right: 48px;
    background: url(img/arrow-down.svg)no-repeat;
    background-position: 100% center;
    background-size: 33px;
    display: inline-block;
    font-style: normal;
}

#price .row .full-row.bordered .togglable b.rotated, .course-title.rotated i {
    background: url(img/arrow-up.svg)no-repeat;
    background-position: 100% 15%;
    background-size: 33px;
}

#price .row .full-row.bordered span.shown { display: block; margin-top: 16px; }

.course {
    display: none;
}

.course.shown { display: block; }

.course.shown p {
    background: none!important;
    padding: 10px 20px!important;
}

#price .row .half-row.bordered.alternative{
    box-shadow: -10px 20px 40px rgba(0,0,0,.06);
}

#lightgallery {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

#lightgallery a{
    width: 32%;
    margin: 0.5%;
    height: 300px;
    /* float:left;
    width:calc(33.33% - 2vw); */
    border-radius:12px;
    overflow:hidden
}

#boutique #lightgallery a {
	width:24%;
	transition:.3s;
	padding:20px;
}

#boutique #lightgallery a span {
	display:block;
	margin-top:12px;
	text-align:center;
	font-size:19px;
	color:#333;
}

#boutique #lightgallery a:hover {
	box-shadow: 0px 0px 30px rgba(0,0,0,.15);
}

#lightgallery a img{
    display:block!important;
    width:100%;
}

#boutique #lightgallery a img {
	object-fit:cover;
	border-radius:12px;
	overflow:hidden;
	height:180px;
}

#boutique .download-boutique {
	text-align:center;
	margin-top:32px;
	padding-bottom:48px;
}

#boutique .download-boutique a {
	display:inline-flex;
	align-items:center;
	background: #07a4e2;
  	color: #fff;
	padding:10px 60px;
	border-radius:50px;
	transition:.3s;
}

#boutique .download-boutique a:hover {
	background: #67c15e;
}

#boutique .download-boutique a img { max-width:42px; margin-right:8px; }

.contacts-area{
    align-items:stretch;
    clear:both
}
.contacts-area .contacts-area-phone{
    min-height:580px;
    padding:70px 30px 20px;
    text-align:center;
    border-radius:14px;
    border:2px solid rgba(0,0,0,.05)
}
.contacts-area .contacts-area-phone .phone-number{
    font-family:Verdana,serif;
    font-size:1.7rem
}
.contacts-area .contacts-area-phone .phone-number .stroke{
    display:block;
    font-family:'Times New Roman';
    font-size:3.8rem;
    color:#fff;
    letter-spacing:-1px;
    line-height:1;
    -webkit-text-stroke:1px rgba(0,0,0,.7);
    text-stroke:1px rgba(0,0,0,.7)
}
.contacts-area .contacts-area-phone .phone-number .stroke span{
    display:inline-block;
    margin:0 -5px 0 -4px
}
.contacts-area .contacts-area-phone .btns-block{
    display: block;
    margin:15px 0 0 0
}
.contacts-area .contacts-area-phone .btns-block:before{
    display:block;
    margin:0 0 5px 0;
    margin-left:50%;
    content:'';
    width:1px;
    height:50px;
    background-color:rgba(0,0,0,.1)
}
.contacts-area .contacts-area-phone .btns-block a{
    display:inline-block;
    width:auto;
    margin-bottom:20px;
    padding-left:40px;
    font-size:1.45rem;
    transition:all .2s ease-out
}
.contacts-area .contacts-area-phone .btns-block a.tel{
    padding-left:46px
}
.contacts-area .contacts-area-phone .btns-block a:hover{
    filter:grayscale(1)
}
.contacts-area .contacts-area-phone p{
    margin-top:50px
}
#contactForm{
    display:block;
    width:100%;
    min-height:580px;
    padding:40px 100px 0;
    border-radius:14px;
    background-color:rgba(0,0,0,.05)
}
.contacts-messages{
    margin-top:15px
}

.footer-area{
    margin-top:80px;
    padding:80px 8%;
    color:#fff;
    background-color:#363636
}
.footer-area ul{
    width:100%;
    margin:0;
    padding:0;
    align-items:center;
    font-size:1.1rem;
    color:rgba(255,255,255,.7)
}

.footer-area ul li:last-child{
    height:38px;
    line-height:38px
}
.footer-area ul li:last-child .limit-icon{
    display:inline-block;
    vertical-align:middle;
    width:34px;
    height:34px;
    margin-left:15px
}
.footer-area a{
    display:block;
    color:rgba(255,255,255,.7)
}


.footer-area .footer-logo img{
    width:340px
}
.footer-area .footer-logo .site-logo-tagline{
    margin:-18px 0 0 47px
}
.footer-area .footer-logo:hover{
    filter:brightness(1)
}
.footer-area .copyright{
    display:inline-block;
    vertical-align:top;
    margin:-1px 4px 0 0
}
.footer-area .phone{
    font-size:1.75rem;
    font-weight:700;
    line-height:.95
}

@media screen and (max-width:1600px){
    
    h1, h2{
 
    }

    .btn{
        padding:16px 35px;
        border-radius:10px;
        font-size:18px
    }

    .wrapper .wrapper-aside.left {
        left: -20%;
    }
	
	.intro-area .without-bg {
		width: 68.33%;
	}

    .intro-area { 
		background-image: url(img/first-after.webp);
        background-position: 80% center;
    }

}


@media screen and (max-width:1200px){
    h1,h2{

    }
    .title-decor{
        margin-left:1vw
    }
    .btn{
        padding:14px 28px;
        border-radius:8px;
        font-size:16px
    }
    .back,.flip-container,.front{
        width:20.91vw;
        height:36.318vw
    }
    .about-area .row{
        min-height:500px
    }
    .service-area{
        margin:60px 0 90px
    }
    .service-area .subtitle{
        margin-left:55px
    }
    #reviews .review{
        min-height:350px
    }
    #reviews .review .review-author:after{
        width:55px
    }
    .card-ofday-area .card-ofday-image{
        background-size:40.067vw 42.399vw
    }
    .card-ofday-area .card-ofday-image .flip-container{
        top:4.498vw;
        left:79px
    }
    .contacts-area .contacts-area-phone .btns-block a{
        min-height:35px;
        font-size:1.1em
    }
    .footer-area{
        padding:60px 5%
    }
}
@media screen and (max-width:992px){
    h1,h2{
        font-size:66px;
    }

    #price ul.mini li {
        width: 100%;
    }

    .title-decor{
        margin-left:.15vw
    }
    .container{
        width:88%
    }
    .row{
        flex-wrap:wrap
    }
    .half-row{
        width:100%
    }
    aside{
        width:100%
    }
    article{
        width:100%
    }
    .wrapper .wrapper-aside{
        position:relative;
        top:0;
        right:auto;
        max-width:88%;
        height:auto;
        margin:0 auto
    }
    .btn{
        padding:16px 35px;
        border-radius:10px;
        font-size:18px
    }
    .top-link{
        margin-right:calc(6% - 27px)
    }
    .area-header{
        margin-left:0
    }
    .back,.flip-container,.front{
        width:251px;
        height:436px
    }
    .intro-area{
        height:auto;
        margin-bottom:50px;
    }
    .intro-area .half-row:first-child{
        padding-left:5%
    }
    .intro-area .half-row:last-child{
        margin-top:-25px
    }
    #certificate{
        text-align:center
    }
    #certificate a{
        display:block;
        height:auto
    }
    #certificate a picture{
        opacity:.75;
        border-radius:14px;
        overflow:hidden
    }
    .service-area{
        margin:10px 0 48px
    }
    .service-area .subtitle{
        margin-left:0
    }
    .service-area .wrapper-aside{
        display:none
    }
    .reviews-area .btns-block{
        padding:0 5%
    }
    #reviews .review{
        min-height:270px
    }
    .faq-area{
        margin:0
    }
    .faq-area .faq-block{
        padding:60px 13%
    }
    .card-ofday-area{
        margin-top:25px
    }
    .card-ofday-area .area-header{
        transform:translate(0,0)
    }
    .card-ofday-area .card-ofday-content{
        padding:0 6%
    }
    .card-ofday-area .half-row:first-child{
        order:1;
        padding:35px 0
    }
    .card-ofday-area .card-ofday-image{
        width:100%;
        background:url(img/card-ofday/bg-card-ofday.jpg) left 25vw top no-repeat;
        background-size:481px 509px
    }
    .card-ofday-area .card-ofday-image .flip-container{
        top:54px;
        left:calc(25vw + 13px)
    }
    .contacts-area .contacts-area-phone{
        min-height:230px;
        padding:50px 0
    }
    .contacts-area .contacts-area-phone .btns-block a.tel{
        margin-left:30px
    }
    #contactForm{
        margin-bottom:30px;
        padding:40px 100px 65px;
        min-height:280px
    }
    .footer-area{
        padding:60px 4.4%
    }
    .footer-area ul{
        flex-wrap:wrap
    }
    .footer-area ul li:first-child{
        width:100%;
        margin-bottom:35px;
        text-align:center
    }
    .footer-area ul li:nth-child(2){
        display:none
    }
    .footer-area .footer-logo .site-logo-tagline{
        margin:-18px 0 0 54px
    }
}
@media screen and (max-width:768px){
    h1,h2{
        font-size:46px;
        padding-left:0px
    }
    .subtitle{
        margin-left:0
    }
    .subtitle:before{
        content:'';
        display:table;
        clear:both
    }
    .title-decor{
        margin-left:.6vw;
        font-size:70px
    }
    .title-decor.modif{
        min-height:80px
    }
    .photogallery a:after{
        width:30px;
        height:30px
    }
    .back,.flip-container,.front{
        width:38.9vw;
        height:auto
    }
    .back img,.front img{
        transform:scale(1.02,1)
    }
    .intro-area .btn,.service-area .btn{
        margin-right:15px
    }
    .reviews-area .btns-block{
        margin-top:25px
    }
    #reviews .review .review-author{
        font-size:.9rem
    }
    #reviews .review .review-author:after{
        width:30px
    }
    #reviews .review .review-date{
        font-size:.9rem
    }
    .faq-area .question{
        padding:24px 35px 24px 0;
        font-size:1.1rem
    }
    .faq-area .question .plus{
        margin-left:calc(100% - 20px)
    }
    .faq-area .answer p{
        padding:32px 25px 15px
    }
    .card-ofday-area .title{
        padding-left:10px
    }
    .card-ofday-area h1::first-letter,.card-ofday-area h2::first-letter{
        margin:-15px 0 0 -.1em
    }
    .card-ofday-area .card-ofday-image{
        width:100%;
        min-height:77vw;
        background:url(img/card-ofday/bg-card-ofday.jpg) left 15vw top no-repeat;
        background-size:75vw auto
    }
    .card-ofday-area .card-ofday-image .flip-container{
        top:8.55vw;
        left:calc(15vw + 13px)
    }
    .card-ofday-area .card-ofday-image .card-ofday-quote{
        margin-top:88vw
    }
    .gallery-area .title{
        padding-left:10px
    }
    .gallery-area h1::first-letter,.gallery-area h2::first-letter{
        margin:-15px 0 0 -.1em
    }
    .contacts-area .title{
        padding-left:10px
    }
    .contacts-area h1::first-letter,.contacts-area h2::first-letter{
        margin:-15px 0 0 -.1em
    }
    #contactForm{
        padding:40px 12% 65px
    }
    .footer-area{
        padding:60px 4% 0px
    }
    .footer-area ul li:nth-child(6){
        display:none
    }
    .footer-area ul li:last-child{
        width:100%;
        padding:30px 0 15px;
        text-align:center;
        opacity:.5
    }
}
@media screen and (max-width:480px){
    h1,h2{
        padding-left:0px;
        line-height: 1.2;
    }
    .title-decor{
        margin-left:1.5vw;
        font-size:50px
    }
    .title-decor:after{
        top:80%;
        height:35px
    }
    .title-decor.modif{
        min-height:60px;
        margin-bottom:12px
    }
    html{
        font-size:16px
    }
    .top-link{
        margin-right:1em
    }
    .photogallery a:after{
        width:24px;
        height:24px
    }
    .site-logo-tagline{
        padding-right:20px;
        font-size:12px
    }
    .site-logo-tagline span{
        display:inline;
        margin-left:4px
    }
    .intro-area .btns-block{
        text-align:center;
        justify-content: center;
    }
    .service-area .btns-block{
        text-align:center
    }
    .intro-area .btn,.service-area .btn{
        margin-right:0;
        min-width:234px
    }
    .faq-area .answer p{
        padding:0px 15px 15px 0
    }
    .faq-area .answer p:before{
        left:40px
    }
    .card-ofday-area .half-row.animation{
        background:url(img/card-ofday/bg-card-ofday-anima.gif) left 50px top 160px no-repeat;
        background-size:content
    }
    .card-ofday-area .card-ofday-image .flip-container{
        top:8.41vw;
        left:16.8vw
    }
    .card-ofday-area .card-ofday-image .card-ofday-quote{
        padding:45px 25px 35px;
        font-size:1.4rem
    }
    .card-ofday-area .card-ofday-image .card-ofday-quote:before{
        top:-23px;
        width:70px;
        height:51px;
        background-size:50px auto
    }
    .footer-area ul li{
        width:100%;
        text-align:center
    }
    .footer-area ul li:nth-child(3){
        margin-bottom:25px
    }
    .footer-area ul li:nth-child(4){
        display:none
    }
    .footer-area .footer-logo .site-logo-tagline{
        margin:-16px 0 0 64px
    }
}
@media screen and (min-width:1600px){
    html{
        font-size:16px
    }
}
@media (print){
    .animated{
        animation-duration:1ms!important;
        transition-duration:1ms!important;
        animation-iteration-count:1!important
    }
}
@media (max-width:767px){
    .animated.delay-05s,.animated.delay-15s,.animated.delay-1s{
        animation-delay:0
    }
}
@media (max-width:1600px){
    .contacts-area .contacts-area-phone .phone-number .stroke{
        font-size:3.6rem
    }
}
@media (max-width:1200px){
    .contacts-area .contacts-area-phone .phone-number .stroke{
        font-size:2.8rem
    }
}
@media (max-width:992px){
    .contacts-area .contacts-area-phone .phone-number .stroke{
        font-size:4rem
    }
}
@media screen and (max-width:767px){

    .site-navbar {
        padding-top: 12px;
        padding-bottom: 8px;
    }

    .socials { margin-right: 12px; }
    .socials .icon {
        width: 32px;
        height: 32px;
    }
	
    .navbar-list .sublist.opened { display: block; position: relative; top: 0; }

    #first .container { flex-flow: column-reverse; }

    .intro-area { margin-top: 58px; background-position: 200% center, -325% center; background-image: none; }
    .intro-area .half-row:first-child { padding-left: 0; }

    .btns-block { flex-wrap: wrap; }
    .intro-area .btn, .service-area .btn {  width: 100%; display: block; margin-bottom: 12px; }

    .socials .icon.tg img {width: 20px;}
    .socials .icon.wa img {width: 20px;}

    .intro-area .with-bg img { position: relative; top: 6px; }
    .intro-area .with-bg { width: 100%; height: auto; }

    .intro-area .without-bg { width: 100%; }
    .intro-area h1 { max-width: 100%; font-size: 26px; }

    .intro-area p { max-width: 100%; }

    
    .nav-toggler {
        display:block;
        margin-top: 0;
    }

    .navbar-list-parent {
        display: block;
        width: 100%;
        overflow-x:hidden;
        overflow-y:auto;
        scrollbar-width: thin;
        max-height: 75%;
    }

    .navbar-list{
        position:absolute;
        z-index:9999;
        width:100%;
        left:0;
        top:83px;
        margin:0;
        padding:24px 0 48px 0;
        border-bottom:none;
        background-color:#fff;
        transition:height .5s ease;
        display:none
    }
    .navbar-list li{
        width:100%;
        margin:0;
    }
    .navbar-list li:first-child{
        display:block
    }
    .navbar-list li:nth-child(2){
        order:1
    }
    .navbar-list li:nth-child(3){
        order:4
    }
    .navbar-list li:nth-child(4){
        order:2
    }
    .navbar-list li:nth-child(5){
        order:5
    }
    .navbar-list li:nth-child(6){
        order:3
    }
    .navbar-list li:nth-child(7){
        order:6
    }
    .navbar-list li a{
        padding:18px;
        font-size:1.1rem;
        text-transform:uppercase
    }

    .navbar-list li a.sublist-btn {
        background: url(img/arrow-down.svg)no-repeat;
        background-position: 95% center;
        background-size: 32px;
    }

    .navbar-list li a.sublist-btn.opened {
        background: url(img/arrow-up.svg)no-repeat;
        background-position: 95% center;
        background-size: 32px;
    }

    .navbar-list li .sublist {
        background: #eee;
    }
	
	.navbar-list li .sublist a{
        font-size:.95rem;
    }
	
    .navbar-list li a:hover{
        background-color:rgba(0,0,0,.08)
    }
    .navbar-list.open{
        display:block;
        display:flex;
        justify-content:start;
        flex-direction:column;
        align-items:center;
        box-shadow:inset 0 1px 0 0 rgba(0,0,0,.1);
    }
    .intro-area .half-row:first-child{
        padding-top:50px
    }

    #price .row .full-row.bordered {
        padding: 12px;
        border: none;
    }

    #price .row .full-row.bordered img { max-width: 70%; }
    #price .row .titled:first-child h4 { font-size: 23px; max-width: 100%; padding-top: 48px; }
    #price .row .full-row.bordered .titled::after { width: 72px; height: 72px; background-size: 48px; }
    #price .row .titled { margin-bottom: 32px; }
    #lightgallery a { height: auto; }
	#boutique #lightgallery a { width:100%; }

}
@media (max-width:600px){
    h1,h2{
        font-size:48px
    }
	
	.divider { display:block; margin:32px auto; position:relative; height:240px; width:100%; }
	.divider span { display:block; position:absolute; left:0; top:0; width:100%; height:100%; background:#000; }
	
	#price .row .full-row.bordered img { max-height:180px; }
	
    @-moz-document url-prefix(){
        h1::first-letter,h2::first-letter{
            margin-top:-6px
        }
    }
    #reviewsList:before,.area-header:after,p:before{
        content:'';
        display:table;
        clear:both
    }
    .btn{
        padding:15px 27px;
        border-radius:10px;
        font-size:15px
    }
    .intro-area .subtitle{
        font-size:24px
    }
    .card-ofday-area .card-ofday-image .card-ofday-quote{
        margin-left:6%;
        margin-right:6%
    }
    .card-ofday-area .btns-block{
        text-align:center
    }
    .reviews-area .btns-block{
        padding:0 4%;
        text-align:center
    }
    .reviews-area .btns-block p{
        display:block;
        width:100%;
        margin-bottom:20px;
        padding-right:0;
        text-align:left
    }
    #lightgallery a{
        width:46%;
        margin:2%
    }

    .area-header {
        margin-bottom: 32px;
    }

    footer .socials {
        margin-right: 0px;
        justify-content: center;
    }


    .contacts-area .contacts-area-phone .btns-block a.tel{
        display:block;
        width:205px;
        margin:0 auto
    }
}
@media (max-width:480px){
	

    .site-logo {
        position: relative;
        top: 4px;
    }

    .socials .version img {
        max-width: 24px;
        margin-right: 0px;
    }

    .socials .version span {
        display: none;
    }

    h1,h2{
        font-size:44px
    }
    .btn{
        padding:16px 36px;
        font-size:16px
    }
    .navbar-list{
        top:62px
    }
    .contacts-area .contacts-area-phone .phone-number .stroke{
        font-size:2.8rem
    }
    .faq-area .question{
        padding-right:40px;
        font-size:1rem
    }
    .faq-area .plus{
        top:-4px;
        margin-left:calc(100% - 20px)
    }
}
@media (max-width:414px){
    h1,h2{
        font-size:40px
    }
    .site-logo img{
        width:200px
    }
    .site-logo-tagline{
        margin:-19px 0 0 51px
    }
    .nav-toggler{
        margin-top:0px
    }
    .faq-area .faq-block{
        padding:35px 9% 60px
    }
    #reviews .review .review-author:after{
        display:none
    }
    #reviews .review .review-date{
        display:block;
        margin-left:35px
    }
}
@media (max-width:375px){
    .navbar-list li a{
        padding:14px;
        font-size:1rem
    }
    .site-logo-tagline{
        font-size:11px
    }
    .contacts-area .contacts-area-phone .btns-block a{
        padding-left:35px;
        font-size:1rem;
        white-space:nowrap
    }
    .wa{
        background:url(img/whatsapp.svg) left top 1px no-repeat;
        background-size:26px auto
    }
    .tel{
        background:url(img/telegram.svg) left top 2px no-repeat;
        background-size:28px auto
    }
    .contacts-area .contacts-area-phone .btns-block a.tel{
        width:185px;
        padding-left:32px
    }
}
