/**
 * Forms
 */

/* All elements */
.field { margin-bottom: 30px; position:relative; }
.field label { display: inline-block; margin:0; }

[data-validate-for] { display:none; font-size:10px; line-height:10px; position:absolute; right:0; bottom:-1.2em; }
[data-validate-for].visible { display:block; }

/* Textfields & textareas */
.field.textfield input,
.field.textarea textarea { display: block; width: 100%; padding: 10px; border: 1px solid #ccc; }

/* Checkbox & Radio */
.field.checkbox label,
.field.radio label { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; position:relative; margin-bottom:10px; cursor: pointer; }

.field.checkbox input,
.field.radio input,
.field.checkbox span:before,
.field.radio span:before { width:20px; height:20px; margin-right:10px; }

.field.checkbox span:before,
.field.radio span:before { content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); border:1px solid #ccc; background:#fff; }

.field.checkbox span:after,
.field.radio span:after { content:''; position:absolute; left:3px; top:50%; transform:translateY(-50%); width: 14px; height:14px; background:#ccc; opacity:0; transition:all 0.5s ease 0s; }

.field.checkbox input:checked+span:after,
.field.radio input:checked+span:after { opacity: 1; }

.field.checkbox span:before,
.field.checkbox span:after { border-radius: 0; }

.field.radio span:before,
.field.radio span:after { border-radius: 50%; }

.field.radio.inline,
.field.checkbox.inline { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; }
.field.radio.inline label,
.field.checkbox.inline label { margin-right:15px; margin-bottom:0; }

/* Select */
.field.select select { display:block; width:100%; padding:10px; border:1px solid #ccc; }

/* Captcha */
.field.captcha { display:flex; flex-direction:row; justify-content:center; }

/**
 * Navigation
 **/
 
/* Frontend editor */
.ct-widget.ct-ignition { position:fixed; left:auto; top:auto; right:20px; bottom:20px; z-index:10000; transition:all 0.5s ease 0s; }
.ct-widget.ct-ignition .ct-ignition__button { position:static; margin-top:10px;}

.ce-element { outline:2px dashed rgba(243, 156, 18, 0.5); }
.ce-element--focused, .ce-element:focus { outline:2px dashed rgba(243, 156, 18, 1); }

/**
 * Legal
 **/
.legal { margin:60px 0; }
.legal h1 { font-size:4rem; margin:0 0 1em 0; }
.legal h2 { font-size:3rem; margin:1em 0; }
.legal h3 { font-size:2.5rem; margin:1em 0; }
.legal h4 { font-size:2rem; margin:1em 0; }
.legal h5 { font-size:1.5rem; margin:1em 0; }
.legal table { width:100%; margin:2em 0; }
.legal table th,
.legal table td { padding:1em; border:1px solid rgba(0,0,0,0.25); }
/**
 * General Elements
 **/

html { font-size:10px; }
body { font-size:1.4rem; font-family: 'Montserrat', sans-serif; color:#898989; letter-spacing:1px; }
:focus, button:focus { outline:none; }

/* Images */
img, svg { max-width:100%; height:auto; }
img[data-sizes] { display:block; width:100%; }

/* Paragraphs */
p { margin-bottom:1em; line-height:2em; }
p:last-child { margin-bottom:0; }

/* Link */
a { color:inherit; }
a:hover { text-decoration:none; color:inherit; text-decoration:underline; }

/* Lists */
ul, ol { margin-bottom:0; padding:0; list-style:none; line-height:2em; }

/* Titles */
h1 { margin-bottom:1em; color:#1d1d1b; font-size:3rem; font-weight:bold; }
h2 { margin-bottom:1em; color:#1d1d1b; font-size:2rem; font-weight:bold; }
h3 { margin-bottom:1em; color:#1d1d1b; font-size:1.8rem; font-weight:bold; }

iframe { max-width:100%; }

.trait { display:flex; flex-direction:row; align-items:center; justify-content:center; white-space:nowrap; font-size:3rem; font-weight:normal; text-transform:uppercase; color:#1D1D1B; margin-bottom:2em; }
.trait:before, .trait:after { content:''; width:100%; height:1px; background:rgba(0,0,0,0.25); }
.trait:before { margin-right:50px; }
.trait:after { margin-left:50px; }

/**
 * Components
 **/

/* Alert */
.alert { position: relative; padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: .25rem; }
.alert .close { display:none; }
.alert-success { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }
.alert-primary { color: #004085; background-color: #cce5ff; border-color: #b8daff; }
.alert-secondary { color: #383d41; background-color: #e2e3e5; border-color: #d6d8db; }
.alert-danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }
.alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba; }
.alert-info { color: #0c5460; background-color: #d1ecf1; border-color: #bee5eb; }

/* Forms */
.field label { position:absolute; left:30px; top:50%; transform:translateY(-50%); color:#000000; transition:all 0.3s ease 0s; }
.field.active label,
.field.filled label { font-size:1.2rem; top:0; transform:translateY(0); }

.field.textfield input { border:none; border-bottom:1px solid rgba(0,0,0,0.3); padding:20px 30px 5px 30px; background:none; font-weight:600; }

.field.textarea label { transform:translateY(0); top:30px; }
.field.textarea textarea { padding:30px; border:1px solid rgba(0,0,0,0.3); background:transparent; font-weight:600; }
.field.textarea.active label,
.field.textarea.filled label { top:10px; }

/**
 * Layout
 **/

#page { position:relative; width:100%; overflow:hidden; }

#header { position:fixed; left:0; top:0; width:100%; z-index:5; transition:all 0.5s ease 0s; }
#header .row { height:100px; align-items:center; justify-content:space-between; }
#header .logo a { font-weight:bold; font-family:'Georgia'; font-size:1.8rem; font-style:italic; }
#header .logo a:after { content:none; }
#header .logo img { margin-right:15px;width:90px; }
#header .navigation { display:flex; flex-direction:row; align-items:center; justify-content:center; font-family:'Montserrat', sans-serif; font-weight:bold; text-transform:uppercase; }
#header .navigation .primary { display:flex; flex-direction:row; align-items:center; justify-content:center; }
#header .navigation .primary > li { margin:0 8px; }
#header .navigation .dropdown { position:absolute; transition:all 0.3s ease 0s; border:1px solid #ccc; display:none; }
#header .navigation .dropdown li { border-top:1px solid #ccc; }
#header .navigation .dropdown li:first-child { border-top:none; }
#header .navigation .dropdown a { background:#fff; display:block; padding:5px; transition:all 0.3s ease 0s; }
#header .navigation .dropdown a:after { content:none; }
#header .navigation .dropdown a:hover { background:#eee; }
#header .navigation li.open .dropdown { display:block; }
#header .navigation .dropdown .dropdown { display:none !important; }
#header .phone { display:flex; flex-direction:row; align-items:center; justify-content: flex-end; font-weight:600; color:#1D1D1B; white-space:nowrap; }
#header .phone svg { margin-right:15px; }
#header a { color:#1d1d1b; position:relative; padding:5px 0; }
#header a:after { content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:#1d1d1b; transition:all 0.5s ease 0s; }
#header a:hover { text-decoration:none; }
#header li.active a,
#header a:hover:after { width:100%; }
#header a.btn { display:none; }

#header.not-top { background:#f5f5f5; }

#footer .top { background:#F5F5F5; color:#292929; }
#footer .top .menu { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; font-size:1.2rem; }
#footer .top .menu ul { column-count:2; column-gap:80px; position:relative; }
#footer .top .menu ul:before { content:''; position:absolute; left:50%; top:0; width:1px; height:100%; background:#292929; }
#footer .top .menu li { margin-bottom:10px; }
#footer .top .menu a { color:#292929; position:relative; padding:5px 0; }
#footer .top .menu a:after { content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:#1d1d1b; transition:all 0.5s ease 0s; }
#footer .top .menu a:hover { text-decoration:none; }
#footer .top .menu li.active a,
#footer .top .menu a:hover:after { width:100%; }
#footer .top .logo { display:flex; flex-direction:row; align-items:center; justify-content: center; }
#footer .top .logo img { width:100px; margin-right:30px; }
#footer .top .socials { display:flex; flex-direction:row; align-items:center; justify-content:flex-end; }
#footer .top .socials li { margin-left:30px; }
#footer .top .socials a svg { transition:all 0.5s ease 0s; }
#footer .top .socials a img { max-width:30px; opacity:0.5; }
#footer .top .socials a:hover img { opacity:1; }
#footer .bottom .copyright { display:flex; flex-direction:row; align-items:center; justify-content:flex-start; font-size:1.2rem; }
#footer .bottom .copyright li { margin-right:30px; }
#footer .bottom a:not(.btn) { color:#292929; position:relative; padding:5px 0; }
#footer .bottom a:not(.btn):after { content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background:#1d1d1b; transition:all 0.5s ease 0s; }
#footer .bottom a:not(.btn):hover { text-decoration:none; }
#footer .bottom li.active a,
#footer .bottom a:not(.btn):hover:after { width:100%; }
#footer .bottom .contact { font-weight:600; color:#1D1D1B; text-align:right; }
#footer .bottom .contact svg { margin-right:15px; }
#footer .bottom .phone { font-weight:600; color:#1D1D1B; text-align:right; }
#footer .bottom .phone svg { margin-right:15px; }

/**
 * General
 **/

.p100 { padding-top:100px; padding-bottom:100px; }
.p50 { padding-top:50px; padding-bottom:50px; }
.p30 { padding-top:30px; padding-bottom:30px; }
.pt0 { padding-top:0 !important; }
.pb0 { padding-bottom:0 !important; }

.m100 { margin-top:100px; margin-bottom:100px; }
.m50 { margin-top:50px; margin-bottom:50px; }
.m30 { margin-top:30px; margin-bottom:30px; }
.mt0 { margin-top:0 !important; }
.mb0 { margin-bottom:0 !important; }

.text-center { text-align:center; }
.text-right { text-align:right; }
.text-left { text-align:left; }

.align-center { align-items:center; }
.justify-center { justify-content:center; }
.space-between { justify-content:space-between; }
.space-evenly { justify-content:space-evenly; }

.legal { margin-top:10vh; }

.parallax { position:relative; overflow:hidden; height:100vh; min-height:600px; max-height:800px; }
.parallax .bg { position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1; object-fit:cover; object-position:center center; }

.more { font-weight:500; color:#1D1D1B; position:relative; display:inline-flex; flex-direction:row; align-items:center; justify-content:flex-start; font-size:1.8rem; margin-top:30px; }
.more:before { content:''; width:50px; height:1px; background:#1D1D1B; margin-right:15px; transition:all 0.5s ease 0s; }
.more:hover { text-decoration:none; }
.more:hover:before { width:80px; }


.hamburger { display:none; position:relative; z-index:6; }

.btn { display:inline-flex; background:#2c2c2c; color:#fff; padding:15px 30px; text-align:center; border:1px solid #c2c2c2; cursor:pointer; }
.btn:hover { background:transparent; color:#2c2c2c; }

#text .text { padding:0 60px 60px 60px; }




/**
 * Page specific
 **/
#heading { display:flex; flex-direction:column; align-items:center; justify-content:center; }
#heading h1 { text-align:center; margin-top:30px; color:#fff; font-weight:300; font-family:'Georgia'; font-size:2rem; color:#000; font-style:italic;}
#heading h1 strong { font-weight:bold; font-size:2.6rem; }
#heading .bg { min-height:100px; object-fit:cover; }

#calendly a { position:fixed; left:20px; bottom:20px; width:auto; height:60px; border-radius:50px; background:#000; display:flex; align-items:center; justify-content:center; padding:15px; color:#fff; }
#calendly svg { fill:#fff; width:30px; height:auto; margin-right:15px; }

#index #seances .block { background:#F5F5F5; }
#index #seances .icon { width:280px; height:280px; background:#ccc; border-radius:100%; display:flex; align-items:center; justify-content:center; margin:0 auto 30px auto; position:relative; z-index:1; }
#index #seances .icon:before { content:''; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; height:100%; background:inherit; z-index:0; border-radius:100%; transition:all 0.5s ease 0s; }
#index #seances .icon svg { fill:#fff; opacity:0.3; }
#index #seances .link:hover { text-decoration:none; }
#index #seances .link:hover .icon:before { width:calc(100% + 30px); height:calc(100% + 30px); }
#index #seances .title { font-size:2rem; }
#index #seances .title:after { content:''; display:block; width:1px; height:30px; background:#010101; margin:30px auto; }
#index #seances .description { color:#898989; }

#index #blog .slider { text-align:center; }
#index #blog .slider .pagination { margin-top:30px; display:flex; flex-direction:row; align-items:center; justify-content:center; }
#index #blog .slider .pagination .swiper-pagination-bullet { margin:0 5px; background:#bfbfbf; opacity:1; }
#index #blog .slider .pagination .swiper-pagination-bullet-active { background:#1c95d1; }
#index #blog .icon { margin:30px 0; text-align:center; }
#index #blog .description a { color:#1c95d1; }

#index #citation { display:flex; flex-direction:column; align-items:center; justify-content:center; color:#fff; font-size:6rem; font-weight:500; margin:0; }
#index #citation p { position:relative; font-family:'Arima Madurai'; margin-bottom:0; margin:0 50px; text-align:center; line-height:1.2em; }
#index #citation p:before { content:'“'; position:absolute; left:-80px; top:-15px; font-size:15rem; }
#index #citation p:after { content:'”'; position:absolute; right:-80px; bottom:-1em; font-size:15rem; }

#content .section { margin-bottom:30px; }
#content .submenu-wrapper { position:relative; margin-bottom:50px; text-align:center; display:flex; flex-direction:column; align-items:center; }
#content .submenu-wrapper .trigger { font-size:2rem; font-weight:bold; text-transform:uppercase; color:#000; display:flex; flex-direction:row; align-items:center; justify-content:center; padding:15px 30px; border:1px solid #ccc; }
#content .submenu-wrapper .trigger img { transition:all 0.3s ease 0s; }
#content .submenu-wrapper .trigger.open img { transform:rotate(180deg); }
#content .submenu-wrapper .trigger img { width:20px; margin-left:10px; }
#content .submenu-wrapper .trigger:hover { text-decoration:none; }
#content .submenu { display:flex; flex-direction:column; align-items:center; justify-content:center; flex-wrap:nowrap; display:none; z-index:2; text-align:center; margin-top:30px; border:1px solid #ccc; padding:0; }
#content .submenu li { border-top:1px solid #ccc; width:100%;  }
#content .submenu li:first-child { border-top:none; }
#content .submenu a { color:#1D1D1B; text-transform:uppercase; font-size:1.4rem; font-weight:500; background:#fff; display:block; width:100%; padding:5px 10px;}
#content .submenu a:hover { text-decoration:none; }
#content .submenu li.active a,
#content .submenu li a:hover { background:#eee; }

#content .submenu li.coaching-coaching-personnel a:after { background:#c3d201; }
#content .submenu li.coaching-coaching-professionnel a:after { background:#1C95D1; }
#content .submenu li.coaching-coaching-parental a:after { background:#ae5ea1; }
#content .submenu li.coaching-coaching-mental a:after { background:#32398e; }
#content .submenu li.coaching-coaching-entreprise a:after { background:#db3916; }

#content .text,
#special .links,
#form .right { padding-left:60px; }
#content .text ul li { display:flex; flex-direction:row; align-items:flex-start; justify-content:flex-start; margin-bottom:5px; }
#content .text ul li:before { content:'›'; font-weight:bold; margin-right:10px; font-size:1.8rem; line-height:1.6rem; color:#000; line-height:1em; position:relative; top:4px; }
#content .text h2 { margin:1em 0; font-size:1.8rem; }
#content .text h3 { margin:1em 0; font-size:1.6rem; }
#content .text h2:first-child { margin-top:0; }

#coaching #content h2,
#coaching #content strong { color:#F49B2C; }
#coaching-coaching-personnel #content h2,
#coaching-coaching-personnel #content strong { color:#c3d201; }
#coaching-coaching-professionnel #content h2,
#coaching-coaching-professionnel #content strong { color:#1C95D1; }
#coaching-coaching-parental #content h2,
#coaching-coaching-parental #content strong { color:#ae5ea1; }
#coaching-coaching-mental #content h2,
#coaching-coaching-mental #content strong { color:#32398e; }
#coaching-coaching-entreprise #content h2,
#coaching-coaching-entreprise #content strong { color:#db3916; }


#special .special { padding:80px; position:relative; }
#special .special.with-childs { padding-left:0; }
#special .special:before { content:''; position:absolute; right:0; top:0; width:100%; height:100%; background:#F5F5F5; z-index:-1; }
#special .special.with-childs:before { width:calc(50vw - 100px); }
#special .links .block { background:#fff; box-shadow:0 0 18px rgba(0,0,0,0.15); padding:80px; position:relative; }
#special .links .block:before { content:''; position:absolute; right:50px; top:0; transform:translateY(-50%); width:50px; height:65px; background:url(../themes/hypnotherapie/assets/img/square.svg) no-repeat center center / contain; z-index:1; }
#special .links .more { font-size:1.4rem; text-transform:uppercase; }

#contact #content { color:#000; }
#contact #content svg { margin:0 0 30px 30px; }

#form .left { padding:60px 60px 0 60px; background:#F5F5F5; }
#form .submit { text-align:center; margin-bottom:0; }
#form .address { float:left; margin-top:30px; color:#000; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; }
#form .address svg { margin:0 0 15px 30px; }
#form .address:after { content:''; width:30px; height:1px; background:#000; display:block; margin-top:30px; }
#form iframe { border:1px solid #d6d6d6; }

#blog-listing #heading { position:relative; }
#blog-listing #heading .caption { position:absolute; text-align:center; top:50%; transform:translateY(-50%); }
#blog-listing #heading h1 { font-weight: bold; font-size: 2.6rem; }
#blog-listing .pagination { display:flex; flex-direction:row; align-items:center; justify-content: center; margin-top:50px; }
#blog-listing .pagination a { display:flex; align-items:center; justify-content:center; border:1px solid #ccc; padding:5px 10px; margin:0 5px; }
#blog-listing .pagination a:hover { background:#eee; text-decoration:none; }


#blog-detail #heading { position:relative; }
#blog-detail #heading .caption { position:absolute; text-align:center; top:50%; transform:translateY(-50%); }
#blog-detail #heading h1 { font-weight: bold; font-size: 2.6rem; }



#mailjet { padding-top:50px; padding-bottom:50px; color:#fff; background:#2c2c2c; }
#mailjet h2 { text-align:center; color:#fff; }
#mailjet .field.textfield input { color:#fff; border-bottom:1px solid rgba(255,255,255,0.3)}
#mailjet .field label { color:#fff; }
#mailjet .field.submit { text-align:center; }
















/**
 * Extra large
 **/
@media (min-width: 1600px) {
    
    .container-fluid { padding-left:60px; padding-right:60px; }
}

/**
 * Extra large
 **/
@media (max-width: 1599px) {
    html { font-size:9px; }
    
    .container-fluid { padding-left:60px; padding-right:60px; }
    
    #index #seances .icon { width:250px; height:250px; }
    
    #special .special.with-childs:before { width:50vw; }
    
    
}

/**
 * Large devices
 **/
@media (max-width: 1199px) {
    html { font-size:8px; }
    
    .container-fluid { padding-left:30px; padding-right:30px; }
    .p100 { padding-top:50px; padding-bottom:50px; }
    .p50 { padding-top:30px; padding-bottom:30px; }
    .more:before { width:30px; }
    
    #header .phone { display:none; }
    #header .navigation { justify-content:flex-end; }
    
    #text .text,
    #content .text { padding:0 30px 30px 30px; }
    
    #index #seances .icon { width:200px; height:200px; }
    
    #special .special,
    #special .links .block { padding:50px; }
    
    #content .section { margin-bottom:30px; }
    
}

/**
 * Medium devices
 **/
@media (max-width: 991px) {
    .hamburger { display:flex; }
    .more:before { width:15px; }
    
    #header .navigation .primary { position:fixed; left:0; top:0; width:100%; height:100%; background:#F5F5F5; z-index:5; flex-direction:column; font-size:2rem; opacity:0; transition:all 0.5s ease 0s; pointer-events:none; }
    body.open #header .navigation .primary { opacity:1; pointer-events:auto; }
    
    #special .special,
    #special .links .block { padding:30px; }
    
    #header a.btn { display:inline-block; }
}

/**
 * Small devices
 **/
@media (max-width: 767px) {
    html { font-size:9px; }
    #text .text,
    #content .text { padding:0; margin-top:30px; }
    
    #index #seances li { margin-bottom:30px; }
    
    #index #citation p:before { left:-30px; }
    #index #citation p:after { right:-30px; }
    
    #footer .container { max-width:none; }
    #footer .top .logo { justify-content:flex-start; }
    #footer .top .menu { display:none; }
    #footer .bottom .phone { display:none; }
    
    #special .special.with-childs { padding:30px; }
    #special .special.with-childs:before { width:100%; }
    #content .text, #special .links, #form .right { padding-left:0; margin-top:30px; }
}

/**
 * Extra small devices
 **/
@media (max-width: 575px) {
    .trait { white-space:normal; }
    .trait:before,
    .trait:after { content:none; }
    #footer .bottom .copyright { justify-content:center; }
    #footer .bottom .contact { display:none; }
    
    #footer .top .logo svg { display:none; }
    #footer .top .row { align-items:center; } 
    #footer .top .socials { flex-direction:column; }
    #footer .top .socials li { margin-bottom:10px; }
    
    #calendly { display:none; }
}