.sandbox .editor .tag{align-items:inherit !important;background-color:inherit !important;border-radius:inherit !important;display:unset !important;font-size:inherit !important;font-weight:inherit !important;height:inherit !important;justify-content:inherit !important;line-height:inherit !important;padding:inherit !important;white-space:inherit !important}header{position:-webkit-sticky;position:sticky;left:0;top:0;height:88px;width:100vw;box-sizing:border-box}header .topbar-wrapper{border-bottom:2px solid var(--color-main-fade);position:relative;background-color:#fff;z-index:100;padding-top:0;padding-bottom:0}header .topbar-wrapper .nav-links-wrapper{justify-content:space-between}header .topbar-wrapper .nav-links-wrapper .main-links .button.is-active{background-color:var(--color-bg-ghost-hover) !important}header .topbar-wrapper .segmented-control{max-width:550px}header .topbar-wrapper .icon.topbar-icon{width:24px;height:24px;cursor:pointer}header .topbar-wrapper .icon.topbar-icon i{width:100%;height:100%}@media screen and (max-width: 1024px){header{height:68px}}#search{border-bottom:2px solid #d8d8d8;width:100vw;background-color:#fff;max-height:calc(100vh - 80px);margin-top:-122px;transition:.3s;padding:16px 0;overflow:auto}@media screen and (max-width: 1024px){#search{padding:0;max-height:calc(100vh - 68px)}#search .search-input{padding:16px}}#search[data-is-open=true]{margin-top:0}#search[data-is-open=true]:before{content:"";z-index:-1;position:absolute;top:0;left:0;width:100vw;height:100vh;background-color:rgba(0,0,0,.6)}#search .search-input{max-width:768px;margin:auto}#search .search-input input{margin:0}#search .search-results{margin:auto;margin-top:16px}#search .search-results .card{margin:0}#search .search-results .card .card-image{background-color:#f5f5f5}#search .search-results .card .card-image img{object-fit:contain;max-width:100%;max-height:100%;left:50%;top:50%;margin:auto}@media screen and (min-width: 1024px){#search .search-results .card .card-image img{transform:translate(-50%, -50%)}}#nav-mobile{background-color:#fff;margin-top:calc(88px - 100vh);transition:.3s;width:100%;position:absolute;top:0;left:0;height:calc(100vh - 68px);display:block}@media screen and (min-width: 1024px){#nav-mobile{display:none}}#nav-mobile .rows{margin:0;height:100%;justify-content:center;margin-top:-48px}#nav-mobile .rows a.button{font-family:Bouygues Speak,Poppins,Arial #000,Arial Bold,serif;font-size:24px;text-decoration:underline}#nav-mobile[data-is-open=true]{margin-top:68px}#breadcrumb-nav{overflow:auto;padding-bottom:24px}#breadcrumb-nav li a.link{display:flex;align-items:center}@media screen and (max-width: 1024px){#breadcrumb-nav{margin-top:-12px !important}}#component img.component-image-preview{box-shadow:rgba(99,99,99,.2) 0 2px 8px 0;border-radius:8px}#component section.section:first-child:not(#sandbox-compiler section){padding-top:0;padding-bottom:0}#component a[href="#usage"],#component a[href="#do-dont"]{margin-bottom:24px}#component #left-panel{max-width:225px;border-right:2px solid var(--color-main-fade);padding-top:24px !important;padding-bottom:32px !important;height:calc(100vh - 88px);overflow:auto}@media screen and (max-width: 768px){#component #left-panel{display:none}}#component #left-panel .section{padding-left:0 !important}#component #left-panel .section .title{font-family:Bouygues Speak,Poppins,Arial #000,Arial Bold,serif}#component #left-panel .section ul.list{row-gap:4px}#component #left-panel .section ul.list li{list-style:none;margin:0 !important;margin-right:-24px !important}#component #left-panel .section ul.list li a{width:100%;display:block;padding:8px 0 !important;padding-left:16px !important;box-sizing:border-box}#component #left-panel .section ul.list li a:hover,#component #left-panel .section ul.list li a.is-active{background-color:var(--color-main-fade);border-right:2px solid var(--color-main)}#component #main-panel{height:calc(100vh - 88px);overflow-y:auto;overflow-x:hidden;padding-top:24px !important;padding-bottom:32px !important}@media screen and (max-width: 768px){#component #main-panel{overflow:unset;height:auto}#component #main-panel>.section{padding-left:0 !important}}#component #main-panel>.section{padding-right:0 !important;padding-left:48px}.tabs{margin-bottom:16px}.tabs .tab{padding:0 !important;margin:0 !important;margin-right:16px !important}.tabs .tab .title{font-weight:400 !important;margin:0 !important}.tabs .tab:last-child{margin-right:0}#welcome-page{position:fixed;left:0;top:0;width:100vw;height:100vh;z-index:1000}@keyframes fadeIn{from{opacity:0}to{opacity:1}}#welcome-page #main-title{opacity:0;transform:translateY(16px);animation:fadeIn .3s ease-in forwards,moveUp .5s .3s ease-out forwards;margin-bottom:0}@keyframes moveUp{from{transform:translateY(16px)}to{transform:translateY(0)}}#welcome-page #main-subtitle{opacity:0;animation:fadeIn .3s .5s ease-in forwards}#changelog-page .box-content{padding:16px}#changelog-page .box-content .list{row-gap:4px}#sandbox-compiler>div{display:block !important}.spacer.has-size-small{height:8px;width:8px}.spacer.has-size-medium{height:16px;width:16px}.spacer.has-size-large{height:24px;width:24px}.spacer.has-size-xlarge{height:32px;width:32px}.spacer.has-size-xxlarge{height:40px;width:40px}.spacer.has-size-xxxlarge{height:56px;width:56px}.spacer.has-size-xxxxlarge{height:64px;width:64px}@media screen and (max-width: 1024px){.spacer.has-size-small{height:4px;width:4px}.spacer.has-size-medium{height:8px;width:8px}.spacer.has-size-large{height:12px;width:12px}.spacer.has-size-xlarge{height:16px;width:16px}.spacer.has-size-xxlarge{height:20px;width:20px}.spacer.has-size-xxxlarge{height:24px;width:24px}.spacer.has-size-xxxxlarge{height:32px;width:32px}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes popIn{0%{transform:translateY(300px)}25%{transform:translateX(0)}50%{opacity:1}100%{opacity:0}}@keyframes slideInFromLeft{from{transform:translateX(-100%);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes slideIn{from{transform:translateX(-300px)}to{transform:translateY(0)}}@keyframes slideInTop{from{transform:translateY(-64px)}to{transform:translateY(0)}}@keyframes slideInBottom{from{transform:translateY(0)}to{transform:translateY(-64px)}}body{min-height:100vh !important;background-color:var(--color-white)}body a{color:var(--color-font);cursor:pointer;text-decoration:none}body .columns.is-fullheight{height:100% !important}body .has-background-grey-light{background-color:var(--color-bg-grey) !important}body .main pre{background-color:#f4f4f4 !important}body .main .text pre{padding:4px 8px;display:inline}body .main .markdown-content ul.list{list-style:circle !important;margin-left:0}body .main .markdown-content ul.list:not(:last-child){margin-bottom:16px}body .main .markdown-content ul.list li{padding:0 !important;margin-left:24px;margin-bottom:4px !important}body .main .markdown-content>.title:first-child{margin-top:0 !important}body .main .markdown-content .title.is-level-1,body .main .markdown-content .title.is-level-2,body .main .markdown-content .title.is-level-3{margin-top:48px;margin-bottom:16px}body .main .markdown-content .title.is-level-4,body .main .markdown-content .title.is-level-5,body .main .markdown-content .title.is-level-6{margin-top:24px;margin-bottom:8px}body .main .markdown-content figure.image{margin:16px 0}@media screen and (min-width: 1024px){body .main section.section:first-child{padding-top:24px}}body .import-container{display:flex}body .import-line{display:flex}body .import-line p{padding-right:8px;color:gray}body .wtu-container{padding-top:24px;display:block !important}body .example-container{padding-top:32px;display:block !important}body .description-container{display:block !important}body .sandbox-view{max-width:400px !important}body .flex{display:flex;justify-content:space-between}body .component-props-table{width:100%}body .component-props-table .columns{min-height:30px;max-height:150px;overflow:auto}body .component-props-table tr{display:table-row}body .component-props-table th{min-width:120px;width:25%;padding:0 8px}body .component-props-table th:first-child{padding-left:0}body textarea{width:100%;height:80px;background-color:#d3d3d3;white-space:pre-wrap}body .design-tab{margin-left:0 !important}body .centered{margin:auto}body .topbar{display:flex;width:100%;padding:24px;align-items:center;justify-content:space-between}body .topbar-left{width:50%;left:0;display:flex;align-items:center}body .topbar-right{width:50%;justify-content:center !important;display:flex !important}body .alert-container{text-align:center;margin:auto;display:flex}body .tab-context{text-align:left !important;background-color:inherit !important}body .card-icon{width:32px !important;height:32px}body .tags-container{padding:16px 0 16px}body .tags-container .tag{margin-right:8px}body .half-length{width:49% !important}body .color-card{display:flex;align-items:center;justify-content:space-between}body .letter-container{background-color:#eee;border-radius:5px;color:#25465f;padding:4px}body .trilogy-third-title{font-size:24px !important;padding:24px 0px 16px}body .justified-center{justify-content:center !important}body .icon-list{display:flex;flex-wrap:wrap}body .searched-icon{width:32px;height:auto}body .component-card{width:100%;margin:auto;max-width:400px;border:1px solid var(--color-bg-main)}body .component-card .card-image img{width:100%;background-color:#f4f4f4}body .component-card .card-content{border:none !important}body .rule-images-container{padding:24px 0px 24px;display:flex;justify-content:space-between}body .component-rule-description{padding:16px 0px}body .component-when-to-use-title{padding:8px 0px 8px;font-size:18px !important}body .segmented-control .segmented-control-item,body button.button,body a.button{font-family:Bouygues Read,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}body .z-top{z-index:99}@media screen and (max-width: 1000px){body .topbar-left{width:100%}body .topbar-right{width:100%}body .topbar-container{padding:16px}}@media screen and (max-width: 1023px){body .topbar-container{height:96px}body .topbar-container input{height:46px}body .burger-container{display:flex !important;padding:4px 8px;border-radius:5px}body .burger-container img{width:36px !important;height:36px}}body .modal-custom{width:100%;height:100vh;top:0px;background-color:#eee;position:relative;animation:fadeIn .3s}body .modal-custom li{padding:16px 24px 16px 24px}body .modal-custom a{text-decoration:none !important;-webkit-text-decoration-line:inherit !important;text-decoration-line:inherit !important;color:#25465f}body .burger-is-active{border-left-color:#25465f;border-left-width:4px;border-left-style:solid;background-color:#e4eaed;padding-left:28px}body .editor{border:none;border-radius:5px}body .search-results{display:block}body section{width:100%}body section.section.is-small{padding-top:16px;padding-bottom:16px}body section.section.is-medium{padding-top:32px;padding-bottom:32px}body .image-transition{transition:transform .3s ease-in-out,opacity .3s ease-in-out}body .image-visible{transform:scale(1);opacity:1}body .copy-button{margin:24px 8px 0px 0px}body .align-right{text-align:right !important;right:0}body .alert-fade{position:fixed;z-index:9999;bottom:0;left:42%;animation:popIn 1s}body .alert-copy-fade{position:fixed;z-index:9999;bottom:0;margin-left:auto;margin-right:auto;animation:popIn 1s}body .import-line{display:flex}body .columns-buttons{margin-top:12px}body .copy-card{height:24px;width:24px;cursor:pointer}body .copy-card:hover{background-color:#d3d3d3}body .no-opacity{top:-64px;transition:.5s;position:relative;animation:SlideInBottom 1s}body .code-string{background-color:rgba(12,123,145,.2);padding:2px 4px;border-radius:5px}body .no-padding{padding:0;margin:0}body .parent-link{display:flex;width:100%;padding:12px 24px}body .hero.has-pattern-dark{background:url(https://assets.bouyguestelecom.fr/TRILOGY/trilogy-framework@3.9.7-beta-1/assets/jpg/transparent-noise.png),url(https://assets.bouyguestelecom.fr/TRILOGY/trilogy-framework@3.9.7-beta-1/assets/svg/pattern-dark-logo.svg) no-repeat,linear-gradient(#1b3650, #0C7B91) !important;background-size:auto,105%,auto !important;background-position:top left,50% 35%,top left !important}body .header-mobile .menu-table{width:100%;text-align:center;border-collapse:collapse}body .header-mobile .menu-table-cell{border:1px solid #e5e5e5}body .header-mobile .menu-button{background:none;border:none;padding:20px;width:100%;text-align:center;cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:center}body .header-mobile .menu-icon{margin-right:8px;vertical-align:middle}body .header-mobile .menu-button span{vertical-align:middle}body pre{background-color:#f4f4f4;border-radius:8px}body pre:not(:last-child){margin-bottom:8px}body pre code{color:var(--color-accent)}