/*
Theme Name: dokiva-child
Template: dokiva
Description: Rédaction de lettre avec l'IA
Author URI: https://dokiva.com

Version: 1.0.0
Tags:Lettres, IA.
*/

@font-face {
 font-family: 'jakarta';
 src: url('fonts/jakarta/plus-jakarta-sans-latin-400-normal.woff2') format('woff2');
 font-weight: normal;
 font-style: normal;
 font-display: swap;
}

@font-face {
 font-family: 'jakarta';
 src: url('fonts/jakarta/plus-jakarta-sans-latin-400-italic.woff2') format('woff2');
 font-weight: normal;
 font-style: italic;
 font-display: swap;
}

@font-face {
 font-family: 'jakarta';
 src: url('fonts/jakarta/plus-jakarta-sans-latin-600-italic.woff2') format('woff2');
 font-weight: bold;
 font-style: italic;
 font-display: swap;
}

@font-face {
 font-family: 'jakarta';
 src: url('fonts/jakarta/plus-jakarta-sans-latin-600-normal.woff2') format('woff2');
 font-weight: bold;
 font-style: normal;
 font-display: swap;
}

@font-face {
 font-family: 'jakarta';
 src: url('fonts/jakarta/plus-jakarta-sans-latin-700-normal.woff2') format('woff2');
 font-weight: 700;
 font-style: normal;
 font-display: swap;
}


:root {
  --color-bg: #F8F8FC;
  --color-text: #0B1126;
  --color-primary: #5242ED;
  --color-secondary: #9283FB;
  --color-title: #0B1126;
  --color-block: #F8F5FE;
  --color-light: #FFFFFF;
  --color-border: #D5D3D1;
  --color-dark: #0B1126;
}


/* START CSS GENERAL */
*, *::before, *::after {box-sizing: border-box;}
html {box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-size: 16px;}
body {margin: 0; font-size: 1rem; font-weight: 400; line-height: 1.5; text-align: left; background: white; height: 100%;}
body, button, input, select, textarea {font-family: 'jakarta', 'Helvetica Neue', Arial, sans-serif; font-size: 16px; line-height: 1.5; color: #30323d;}
::selection {background: var(--color-primary); color: #FFFFFF;}
input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px #fbfbfa inset; box-shadow: 0 0 0px 1000px #fbfbfa inset;}
.disp-flex {display: flex;}
.flex-wrap {flex-wrap: wrap;}
.align-item-center {align-items: center;}
.disp-flex .col25 {width:25%;}
.disp-flex .col33 {width:33.333%;}
.disp-flex .col50 {width:50%;}
.disp-flex .col60 {width:60%;}
.disp-flex .col40 {width:40%;}
.disp-flex .col20 {width:20%;}
.disp-flex .col30 {width:30%;}
.disp-flex .col35 {width:35%;}
.disp-flex .col15 {width:15%;}
.bloc-template-cv {padding: 15px;}
.bloc-img-template-cv {margin-bottom: 15px;}
.align-center {text-align: center;}
.cv-contenu {overflow:hidden;}
.fa, .far, .fas {font-family: "Font Awesome 6 Pro" !important;}
:focus-visible {outline-color: #154467 !important;}
h4 {font-size: 17px !important; padding-top:10px}
.txt-metier h5{text-transform: none;}
a {color: var(--color-primary);}
.h2-style {font-size: 30px; letter-spacing: 1px;}
body .cv-preview, button, input, select {line-height: 5mm !important;}
#cookie-law-info-bar span{color: gray; font-weight: 200 !important; padding: 0 60px;}
#cn-accept-cookie {background: #fed456; color: black !important;}
h3 {font-size: 21px !important; line-height: 1.2; padding-top: 20px; padding-bottom: 5px; font-weight: 600 !important;}
h2 strong , h3 strong {font-weight: 600 !important;}
h2 {font-weight:700 ; font-size:29px; line-height: 1.3;}
.site-branding .site-logo-div {width:100% !important;}
h1, h2, h3, h4, h5 {font-family: 'jakarta', 'Helvetica Neue', Arial, sans-serif !important; color: var(--color-title); margin: 0;}
.padding-top20 {padding-top:20px}
.margin-top50 {margin-top:50px}
.gap50 {gap: 50px;}
.gap30 {gap: 30px;}
.gap20 {gap: 20px;}
.gap15 {gap: 15px;}
.btn1 {background: var(--color-primary); display: table; padding: 10px 30px; border-radius: 5px; color: white; font-weight: 500; text-decoration: none !important; transition: .4s;}
.btn1:hover {color: white; background: var(--color-dark);}
.btn-ia {color: white; background: var(--color-bg-ia) !important;}
.justifiy-content-center {justify-content: center;}
.btn-center {margin: auto;}
header .container, footer .container {width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto;}
img {height: auto; max-width: 100%; vertical-align: middle;}
input[type=text], input[type=phone], input[type=email], textarea, select {font-size: 16px !important;}
.cli-plugin-button, .cli-plugin-button:visited, .medium.cli-plugin-button, .medium.cli-plugin-button:visited {border-radius: 5px; font-size: 16px;}
table {width: 100%; border-collapse: collapse; font-family: 'jakarta', 'Helvetica Neue', Arial, sans-serif; font-size: 16px; overflow: hidden;}
th {background-color: var(--color-block); color: #0a1f40; padding: 12px; text-align: left; border-bottom: 4px solid var(--color-bg); border-radius: 10px; font-weight: 600;}
td {padding: 10px; border-bottom: 4px solid var(--color-bg); background: #ffffff; border-radius: 10px;}
th, td {border-left: 4px solid var(--color-bg); border-right: 4px solid var(--color-bg);}
th strong, td strong {font-weight: 600 !important; color: #0a1f40;}
th:first-child, td:first-child {border-left: none;}
th:last-child, td:last-child {border-right: none;}
.color-blue {color: var(--color-primary);}
.justify-content-center {justify-content: center;}
.h2-svg svg {height: 32px; margin-bottom: -4px; fill: var(--color-primary);} 
/* END CSS GENERAL */



/* START MENU */
#masthead .onepress-menu {margin: 0 !important; line-height: 75px;}
.followWrap {position: sticky; top: 0px; background: var(--color-bg); z-index: 999;}
.admin-bar .followWrap {top: 32px;}
#masthead {z-index:9; box-shadow: none; height: 100%;}
.ft-menu ul li a:hover {color:#09223B}
.ft-menu ul li.current-menu-item > a {color:#09223B}
.site-topbar {background: #1b4e7b; line-height:60px}
.home .site-topbar {background: #00000021 !important}
#topbar:hover a {transition: 0.3s;}
.menu-compte a{display:block !important; width: auto; height: 100%;}
.onepress-menu ul li a {border-top: none !important; color: var(--color-text) !important; padding: 7px 15px; background: transparent; border-radius: 3px; margin: 5px; font-size: 16px; font-family: 'jakarta', 'Helvetica Neue', Arial, sans-serif;}
.onepress-menu ul li a:hover {background: var(--color-bg);}
.onepress-menu a {text-decoration: none !important;}
.onepress-menu li:hover > ul {opacity: 1; height: auto; top: 90% !important;}
.menu-compte a, .onepress-menu a {color: var(--color-title); font-family: 'jakarta', 'Helvetica Neue', Arial, sans-serif !important; font-weight: 600 !important; text-transform: inherit !important; letter-spacing: 0 !important;}
.site-header-wrapper.is-fixed .menu-item-2638 {background:#FDCF4F !important;}
.site-header-wrapper.is-fixed .menu-item-2638 a {color:#18406d !important;}
.onepress-menu.onepress-menu-mobile {height: auto !important;  box-shadow: 7px 5px 30px rgba(72,73,121,.15);}
#header-section .deprec {position: fixed; background-color: #ffca4c; padding: 10px 10px 40px 10px; z-index: 999999999; width: 50vw; right: 20px; top: 92px;}
#header-section .deprec a.link {text-decoration:underline;}
#header-section .deprec a.button {position: absolute; bottom: 10px; right: 10px; padding: 5px 10px; color: white; background-color: #da3b3b; border-radius: 5px; cursor:pointer;}
#header-section .deprec a.button:hover {background-color: #ec2d2d;}
#header-section {position: relative !important; right: 0 !important; border:none !important; z-index: 9 !important;}
.site-header-wrapper.no-scroll .site-branding .site-logo-div {width: 60%; max-height: 60px;}
.site-branding {width:73%}
#nav-toggle span, #nav-toggle span:after, #nav-toggle span:before {height: 2px !important;}
.container-menu {display: flex; justify-content: space-between; align-items: center; padding: 0 20px; height: 100%;}
.container-menu .site-branding {margin-right: auto; flex: 1;}
.container-menu .main-navigation {flex: 2; display: flex; justify-content: center; align-items: center;}
.menu-btn-login a {line-height: 1.6; font-size: 16px;}
.menu-btn a {background: var(--color-dark); line-height: 1.6; padding: 8px 20px !important; border-radius: 10px; color: white;}
.menu-bot .onepress-menu {display: flex; gap: 10px; justify-content: flex-end;}
.sub-menu .menu-item a i {font-size: 16px; color: var(--color-primary); padding-right: 5px;}

@media only screen and (min-width: 834px) and (max-width: 1200px){
    header .container {position: relative; width: 100% !important;}
    
}

@media only screen and (min-width: 834px){
    .onepress-menu {display: flex !important; width: auto; align-items: center;}
    #nav-toggle {display: none !important;}
    .onepress-menu .sub-menu {top: 70% !important; transition: 0.4s; display: block !important; opacity: 0; box-shadow: 7px 5px 30px rgb(56 56 56 / 30%); border-radius: 3px; background: white; border: none; height: 0; overflow: hidden;}
    header .container {display: flex; align-items: center;}
    header .menu-login span {display: none;}
    .main-navigation {display: flex; gap: 20px;}
    .menu1 {flex: 1; justify-content: center;}
    .menu-bot {flex: 1; justify-content: flex-end;}
}

@media only screen and (max-width: 833px){
    header .container {width: 100% !important;}
    .onepress-menu.onepress-menu-mobile>li>a {padding: 12px 0px 0 0; font-weight: 600 !important; color: var(--color-title);}
    .onepress-menu {display: none !important; width: 100%;}
    .onepress-menu.onepress-menu-mobile {top: 0px !important; min-height: 100vh !important; padding: 30px !important; background: var(--color-bg) !important; position: absolute; overflow: auto !important; display: block !important; width: 100% !important; right: 0; height: 100% !important;}
    .onepress-menu a {font-size: 20px; line-height: 30px; font-weight: 600 !important;}
    #nav-toggle {padding-bottom: 0px !important; position: relative; z-index: 999;}
    .onepress-menu .sub-menu {display: block !important;}
    .onepress-menu .sub-menu a {font-size: 18px; padding-top: 1.5px !important; padding-bottom: 1.5px !important;}
    .onepress-menu.onepress-menu-mobile li {width: 100%;}
    .nav-toggle-subarrow {display: none !important;}
    .menu-login {border-top: solid 2px var(--color-block); margin-top: 10px !important;}
    .onepress-menu.onepress-menu-mobile>.menu-login>a {padding: 15px 0 !important; font-size: 16px;}
    .menu-login a span {margin-left: 15px;}
    .menu-bot {position: fixed; bottom: 0; background: white; z-index: 99; right: 0; width: 100%;}
    .menu-bot > .onepress-menu-mobile {top: auto !important; min-height: auto !important; overflow: hidden !important; position: relative !important; height: auto !important; padding-top: 5px !important; border-top: solid 1px var(--color-border); text-align: center; background: var(--color-block) !important;}
    .menu-bot > .onepress-menu-mobile .menu-login {border-top: 0; margin-top: 0 !important;}
    .main-navigation > .onepress-menu-mobile {padding-bottom: 155px !important;}
    .onepress-menu.onepress-menu-mobile>.menu-btn>a {display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 16px;  width: min-content; margin: auto; padding: 4px 35px !important;}
    header .menu-btn a i {position: relative !important; left: auto; top: auto;}
    .container-menu .main-navigation {display: none;}
    .nav-is-visible + .main-navigation {display: flex !important; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 9;}
    .menu-btn-login a {border: none; text-align: center; font-size: 18px; justify-content: center; background: none !important;padding-top: 10px !important; padding-bottom: 10px !important;}
    .menu-btn-create a {color: white !important; font-size: 18px; justify-content: center; padding-top: 8px !important; padding-bottom: 8px !important;}
    .onepress-menu.onepress-menu-mobile > li:not(.menu-btn-login, .menu-btn-create) > a {border-bottom: solid 1px var(--color-border); margin-bottom: 7px !important; padding-bottom: 4px;}
    .onepress-menu.onepress-menu-mobile ul li a {padding: 3px 15px !important;}
    .onepress-menu a i.fa-chevron-down {display: none !important;}
}


@media only screen and (min-width: 641px){
    .no-scroll #nav-toggle {padding-bottom: 0px !important;}
    .menu-compte {height: 75px;}
    .menu-item-6908 a{color:#333333}
    .menu-item-6908 .fa-user:before {padding: 10px 11px; background: #ffffff; color: #000000;}
    .site-branding {float: left; width: 200px !important;}
    .no-scroll .site-header {height: 130px;}
}

/* END MENU */