#wpadminbar{display:none;}

/************************************************************
	FONTS
************************************************************/
::-moz-selection {
    /* Code for Firefox */
    color: #fff;
    background: #000;
}

::selection {
    color: #fff;
    background: #000;
}

@font-face {
    font-family: 'icomoon';
    src: url('icomoon/fonts/icomoon.eot?pnbvyk');
    src: url('icomoon/fonts/icomoon.eot?pnbvyk#iefix') format('embedded-opentype'),
        url('icomoon/fonts/icomoon.ttf?pnbvyk') format('truetype'),
        url('icomoon/fonts/icomoon.woff?pnbvyk') format('woff'),
        url('icomoon/fonts/icomoon.svg?pnbvyk#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

[class^="icon-"],
[class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-tiktok-brands:before {
    content: "\e915";
}

.icon-youtube-brands:before {
    content: "\e916";
}

.icon-icon-manager:before {
    content: "\e910";
}

.icon-sitemap:before {
    content: "\e911";
}

.icon-facebook-f-brands:before {
    content: "\e90b";
}

.icon-google-brands:before {
    content: "\e90c";
}

.icon-instagram-brands:before {
    content: "\e90d";
}

.icon-tumblr-brands:before {
    content: "\e90e";
}

.icon-twitter-brands:before {
    content: "\e90f";
}

.icon-arrow-left-regular:before {
    content: "\e90a";
}

.icon-align-left-regular:before {
    content: "\e908";
}

.icon-external-link-regular:before {
    content: "\e909";
}

.icon-artiste:before {
    content: "\e902";
}

.icon-explorateur .path1:before {
    content: "\e903";
    color: rgb(2, 2, 0);
}

.icon-explorateur .path2:before {
    content: "\e904";
    margin-left: -1em;
    color: rgb(0, 0, 0);
}

.icon-explorateur .path3:before {
    content: "\e905";
    margin-left: -1em;
    color: rgb(0, 0, 0);
}

.icon-explorateur .path4:before {
    content: "\e906";
    margin-left: -1em;
    color: rgb(0, 0, 0);
}

.icon-formateur:before {
    content: "\e917";
}

.icon-geek:before {
    content: "\e907";
}

.icon-im_contact:before {
    content: "\e900";
}

.icon-im_linkedin:before {
    content: "\e901";
}

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

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Poppins', Helvetica, Arial, sans-serif;
}
.font-weight-300{font-weight:300!important}
.font-weight-400{font-weight:400!important}
.font-weight-500{font-weight:500!important}
.font-weight-600{font-weight:600!important}
.font-weight-700{font-weight:700!important}
.font-weight-900{font-weight:900!important}
.font-size-1{font-size:.6rem!important}
.font-size-2{font-size:.7rem!important}
.font-size-2-5{font-size:.8rem!important}
.font-size-3{font-size:.9rem!important}
.font-size-3-5{font-size:1rem!important}
.font-size-4{font-size:1.15rem!important}
.font-size-5{font-size:1.3rem!important}
.font-size-6{font-size:1.45rem!important}
.font-size-7{font-size:1.6rem!important}
.font-size-7-5{font-size:1.9rem!important}
.font-size-8{font-size:2.2rem!important}
.font-size-9{font-size:2.75rem!important}
.font-size-10{font-size:3rem!important}
.font-size-11{font-size:3.75rem!important}
.font-size-12{font-size:4.4rem!important}
.font-size-13{font-size:5rem!important}
body,
.p {
    font-family: 'Poppins', Helvetica, Arial, sans-serif;
    font-weight: normal;
    line-height: 1.8;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.display-4 {
    font-size: 125px;
    font-weight: 600;
    color: white;
    mix-blend-mode: difference;
}

.display-3 {
    font-size: 75px;
    font-weight: 600;
    line-height: 1.3;
}

.h3,
.wp-content h3 {
    font-size: 17px;
    font-weight: 600;
    line-height: 30px;
}

.wp-content h3 {
    margin-top: 25px;
}

.h2, .wp-content h2 {
    font-size: 24px;
    font-weight: 600;
    color: #000;
}

.h2-2 {
    font-size: 30px;
    font-weight: 600;
}

.h1 {
    font-size: 55px;
    font-weight: 600;
    margin-bottom: 40px;
}

.wordtitle {
    display: flex;
    font-size: 28px;
    font-weight: 600;
    text-align: right;
    line-height: 1.3;
}

.wordtitle>span:last-child {
    font-size: 98px;
    line-height: 1;
    position: relative;
    bottom: 17px;
    margin-left: 15px;
}

/*.wordtitle>span:last-child span {
    margin: 0px;
    position: initial;
}*/

.small-caps {
    font-family: 'Roboto', Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 900;
    text-transform: uppercase;
}

.title-1 {
    font-size: 55px;
    font-weight: 600;
    margin-bottom: 25px;
}

img#presentation-image {}

.margin-top-50 {
    margin-top: 50px;
}

.margin-bottom-10 {
    margin-bottom: 10px;
}

.margin-bottom-20 {
    margin-bottom: 20px;
}

.margin-bottom-50 {
    margin-bottom: 50px;
}

.margin-bottom-40 {
    margin-bottom: 40px;
}

.small-button {
    color: #006bca;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    border: 0px;
    background-color: #0000000a;
    border-radius: 50px;
    padding: 8px 15px;
    letter-spacing: 0.5px;
    cursor: pointer;
    line-height: 2;
}

.linebarre {
    text-decoration: line-through !important;
}

/************************************************************
	MARGIN / PADDING
************************************************************/
hr.space-between-section {
    border: 0px;
    padding-top: 80px;
    margin: 0px;
}

w-50 {
    max-width: 50%;
}

/************************************************************
	FOOTER BOTTOM
************************************************************/
.site-container {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.site-content {
    flex: 1;
}

/************************************************************
	ARIANE
************************************************************/
.ariane a,
.ariane li {
    padding: 0px;
    line-height: initial;
    font-size: 10px;
}

.separation {
    padding: 0px 4px 0px 6px;
}

.ariane a {
    display: inline;
}

/************************************************************
	COLORS
************************************************************/
a:focus,
a:hover {
    color: #FF13A4;
}

.primary {
    color: #0DC90F;
    /* Couleur des textes */
}

.primary:hover {
    color: rgb(0, 76, 224);
    /* Couleur de texte hover */
}

.bg-primary {
    color: #fff;
    /* Couleur texte */
    background-color: #0DC90F;
    /* Couleur de fond */
}

.btn.bg-primary:hover {
    color: #000;
    /* Couleur texte hover */
    background-color: #ffd200;
    /* Couleur de fond hover */
}

.bg-secondary {
    color: #000;
    /* Couleur texte */
    background-color: #ffd200;
    /* Couleur de fond */
}

.btn.bg-secondary:hover {
    color: #000;
    /* Couleur texte hover */
    background-color: #ffc000;
    /* Couleur de fond hover */
}

.bg-third {
    background-color: #efefef;
    padding: 80px 0px;
}

/************************************************************
	MENU
************************************************************/
/* CUSTOM EQS : MENU */
nav#main-menu {
    background-color: #fff;
    /* COULEUR DE FOND  */
}

.menu-item a {
    color: #000;
    padding: 16px 13px;
}

.menu-item a:hover {
    color: #349eef;
    /* COULEUR AU HOVER  */
}

.menu-item.current-menu-item>a,
.current_page_ancestor>a {
    color: #98ef34;
}

.menu-item a {
    font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif;
    font-size: 21px;
    font-weight: 600;
    color: #000;
    letter-spacing: 0.2px;
}

.menu-item.current-menu-item>a,
.current_page_ancestor>a {
    font-weight: 600;
}


/************************************************************
	MENU-GAUCHE
************************************************************/
#third-menu {
    background-color: #ccc;
}


/************************************************************
	MOBILE-MENU
************************************************************/
.fa-navicon:before,
.fa-reorder:before,
.fa-bars:before,
i.burger:before {
    color: #0DC90F
        /* Couleur icone mobile nav  */
}

#shiftnav-toggle-main .shiftnav-toggle-burger,
#shiftnav-toggle-main.shiftnav-toggle-main-entire-bar:before {
    padding: 26px 20px;
}

/************************************************************
	HEADER
************************************************************/
/*LOGO*/
img#icon-brand-icon {
    height: 45px;
    /* = hauteur de la navbar */
    padding: 13px 70px 0px 0px;
    /* marges du logo par rapport à la navbar */
}

/************************************************************
	LINKS & BUTTONS
************************************************************/
a {
    color: #0082FF;
}


#cat-le-journal-du-geek a {
    color: #FF13A4 !important;
}

#cat-le-journal-de-lartiste a {
    color: #3cd413 !important;
}

#cat-le-journal-de-lexplorateur a {
    color: #0082FF !important;
}

#cat-le-journal-du-manager a {
    color: #ffa721 !important;
}

/************************************************************
	CONTENT - gallery
************************************************************/
.gallery img {
    border: 2px solid #fff !important;
}

/***** IMG IN POST ******/
img.alignright {
    float: right;
    margin: 10px 0 10px 15px
}

img.alignleft {
    float: left;
    margin: 10px 15px 10px 0
}

img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

a img.alignright {
    float: right;
    margin: 10px 0 10px 15px
}

a img.alignleft {
    float: left;
    margin: 10px 15px 10px 0
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

/************************************************************
	STYLES
************************************************************/


/************************************************************
	STRUCTURE
************************************************************/
.main-container {
    display: flex;
}

div#left-head {
    order: 1;
    width: 85px;
    min-height: 100vh;
    position: fixed;
    left: 0px;
    top: 0px;
    transition: all ease-in-out 0.4s;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

main#content {
    order: 2;
    flex-grow: 2;
    min-height: 100vh;
    margin: 0px 85px;
    transition: all ease-in-out 0.4s;
    position: relative;
}

.padding {
    padding-left: 50px;
    padding-right: 50px;
}

header#main-menu {
    order: 3;
    width: 85px;
    min-height: 100vh;
    position: fixed;
    right: 0px;
    top: 0px;
    border-left: 1px solid #cccccc;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    background-color: #fff;
}

.size-small {
    font-size: 13px;
}

.size-normal {
    font-size: 14px;
    line-height: 2;
}
.size-sm {
    font-size: 12px;
    line-height: initial;
}
.size-md {
    font-size: 14px;
    line-height: initial;
}
.size-lg {
    font-size: 16px;
    line-height: initial;
}

.size-xl {
    font-size: 18px;
    line-height: 2;
}

.no-margin {
    margin: 0 !important;
}

.grey {
    color: #818181;
}

.dark-grey {
    color: #434343;
}

.weight-light {
    font-weight: 300;
}

.weight-bold {
    font-weight: 700;
}

/************************************************************
	HEADERS
************************************************************/
svg#logo-igeneve {
    padding: 11px 34px 34px 34px;
    max-width: 100%;
}
html.whatinput-types-initial {
    margin-top: 0px !important;
}
#emotion-animation {
    padding: 28px 28px 8px 28px;
}
ul#second-menu li {
    text-align: center;
    font-size: 26px;
}

i.round {
    background-color: #000;
    border-radius: 50%;
    color: #fff;
    font-size: 70%;
    padding: 3px;
}

ul#second-menu i.round {
    padding: 0px;
    width: 25px;
    height: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

ul#second-menu i.round.icon-smaller {
    font-size: 50%;
}

ul#second-menu a {
    color: #000;
    padding: 12px 0px;
}

ul#second-menu a:hover {
    color: #0DC90F;
}

ul#second-menu a:hover i.round {
    background-color: #0DC90F;
}

ul#second-menu {
    padding: 31px 0px 31px 0px;
}
img.sms-logo {
    width: 100%;
    max-width: 200px;
    margin-right: 20px;
    margin-bottom: 20px;
}
a.sms-logos {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 20px;
}
header#main-menu .small-caps {
    transform: rotate(-90deg);
    width: 100vh;
    transform-origin: top left;
}

div#title-section {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    z-index: 800;
    position: relative;
    background-color: #fff;
}

header#main-menu .small-caps {
    transform: rotate(-90deg);
    text-align: center;
    min-width: calc(100vh - 84px);
    transform-origin: center center;
}

.grecaptcha-badge {
    display: none !important;
    visibility: hidden;
}

/************************************************************
	BURGER NAV
************************************************************/
body.overflow {
    overflow: hidden;
}

#navigation {
    background-color: #fff;
    border-left: 1px solid #cccccc;
    position: fixed;
    z-index: 9;
    top: 0;
    right: 0;
    height: 100%;
    max-width: none;
    width: auto;
    overflow-y: auto;
    right: 0px;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -moz-transition: all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -o-transition: all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition: all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

#navigation.show {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
    right: 0px;
    padding-right: 84px;
}

ul#main_menu_top,
#nav-right-bloc {
    border-right: 1px solid #cccccc;
}

#navigation.show ul.menu li {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
    opacity: 1;
}

#navigation.show ul.menu li:nth-child(1) {
    transition-delay: 0.15s;
}

#navigation.show ul.menu li:nth-child(2) {
    transition-delay: 0.3s;
}

#navigation.show ul.menu li:nth-child(3) {
    transition-delay: 0.45s;
}

#navigation.show ul.menu li:nth-child(4) {
    transition-delay: 0.6s;
}

#navigation.show ul.menu li:nth-child(5) {
    transition-delay: 0.75s;
}

#navigation.show ul.menu li:nth-child(6) {
    transition-delay: 0.9s;
}

#navigation.show ul.menu li:nth-child(7) {
    transition-delay: 1.05s;
}

#navigation.show ul.menu li:nth-child(8) {
    transition-delay: 1.2s;
}

#navigation.show ul.menu li:nth-child(9) {
    transition-delay: 1.35s;
}

#navigation.show .about,
#navigation.show .social,
#navigation.show ul.sub {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
    transition-delay: .85s;
}

nav ul.menu {
    list-style-type: none;
}

nav ul.menu li {
    -webkit-transform: translateX(40px);
    -moz-transform: translateX(40px);
    -ms-transform: translateX(40px);
    -o-transform: translateX(40px);
    transform: translateX(40px);
    opacity: 0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

nav ul.menu li:last-of-type {
    margin-bottom: 0px;
}

nav .about {
    margin-top: 40px;
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    -o-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

nav .about p {
    color: #ffffff;
    font-family: "Spectral", serif;
    font-size: 1.05rem;
    letter-spacing: 0.5px;
    line-height: 170%;
}

nav .social {
    margin-top: 40px;
    position: relative;
    padding-bottom: 30px;
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    -o-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

nav .social:after {
    content: "";
    width: 230px;
    height: 2px;
    background-color: #b7ac7f;
    position: absolute;
    bottom: 0;
    left: 0;
}

nav .social a {
    display: inline-block;
    width: 30px;
    height: 30px;
    margin-right: 25px;
}

nav .social a:last-of-type {
    margin-right: 0px;
}

nav .social a:hover svg path,
nav .social a:hover svg circle {
    fill: #b7ac7f;
}

nav .social a svg {
    width: 100%;
    height: 100%;
}

nav .social a svg path,
nav .social a svg circle {
    fill: #ffffff;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

nav ul.sub {
    list-style-type: none;
    margin-top: 40px;
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    -o-transform: translateY(30px);
    transform: translateY(30px);
    opacity: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

nav ul.sub li {
    margin-bottom: 10px;
}

nav ul.sub li:last-of-type {
    margin-bottom: 0px;
}

nav ul.sub li a {
    color: #ffffff;
    font-family: "Raleway", sans-serif;
    letter-spacing: 1px;
    font-size: 0.9rem;
    text-decoration: none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

nav ul.sub li a:hover {
    color: #b7ac7f;
}

div#burger.is-active span {
    transition: transform 0.6s cubic-bezier(0.54, 0.1, 0.42, 1.48), width 0.6s ease-in;
}

div#burger.is-active span:first-child {
    transform: rotate(45deg) translate(1px, -3px);
}

div#burger.is-active span:nth-child(2) {
    transform: rotate(-45deg);
}

div#burger.is-active span:last-child {
    transform: rotate(45deg) translate(6px, -4px);
    width: 11px;
}

div#burger span {
    display: block;
    height: 2px;
    background-color: #fff;
    border-radius: 100px;
    transition: transform 0.6s cubic-bezier(0.54, 0.1, 0.42, 1.48), width 0.6s ease-out;
}

div#burger span:not(:last-child) {
    margin-bottom: 4px;
}

div#burger span:first-child {
    transform-origin: 0 50%;
    width: 10px;
}

div#burger span:nth-child(2) {
    width: 20px;
}

div#burger span:last-child {
    transform-origin: 100% 50%;
    width: 17px;
}

#burger-container {
    position: relative;
    z-index: 2000;
    height: 84px;
    background-color: #000;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin-bottom: auto;
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    background-color: #7092b3;
    opacity: 0.2;
    visibility: hidden;
}

.overlay-devis {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    background-color: #7092b3;
    opacity: 0.2;
    visibility: hidden;
}

.overlay.show,
.overlay-devis.show {
    visibility: visible;
}

.blur,
.blur-devis {
    -webkit-filter: blur(4px);
    /* Safari 6.0 - 9.0 */
    filter: blur(4px);
}

#navigation {
    display: flex;
}

#nav-right-bloc {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: center;
}

#nav-right-bloc .fullmenu a {
    text-align: left;
    color: #6f6f6f;
    padding: 0.7rem 0rem;
    font-weight: 400;
    font-size: 1rem;
}
#nav-right-bloc .fullmenu a:hover {
    color: #000;
}

#nav-right-bloc div {
    padding: 10px;
}

#big-contact {
    font-size: 200px;
    margin-bottom: 35px;
}


ul#main_menu_top {
    padding: 60px;
    justify-content: center;
}
.fullmenu-title.titre-2 {
    text-align: left;
}
/************************************************************
	ACCUEIL EMOTIONS
************************************************************/
section#section-emotion img {
    width: 33%;
}

section#section-emotion p.wordtitle,
section#section-404 p.wordtitle {
    margin-top: 90px;
}

/************************************************************
	ACCUEIL SERVICES
************************************************************/
section.section-services p.wordsubtitle {
    margin-top: -40px;
    margin-left: 300px;
    width: 50%;
}

section.section-services p.wordhreftitle {
    display: block;
}

.single-services footer.footer {
    margin: 0px 85px;
}

/************************************************************
	GENERAL
************************************************************/
.section.full {
    min-height: 100vh;
    width: 100%;
    padding: 78px 0px;
}

.flex {
    display: flex;
}

.vertical-center {
    justify-content: center;
}

.horizontal-center {
    align-items: center;
}

.d-column {
    flex-direction: column;
}

.d-row {
    flex-direction: row;
}

/************************************************************
	BUTTON
************************************************************/
.button-standard {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    overflow: visible;
    margin: 0;
    padding: 0;
    text-decoration: none;
    letter-spacing: 0;
    color: #fff;
    border: none;
    outline: 0;
    background: 0 0;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.button-standard {
    font-weight: 600;
    display: inline-block;
    font-size: 14px;
    line-height: 14px;
    letter-spacing: .1em;
    color: #000;
}

.button-icon {
    margin-right: 5px;
    margin-left: 14px;
}

.button-line {
    overflow: hidden;
    position: relative;
    display: block;
    width: 100%;
    height: 3px;
    margin-top: 5px;
}

.button-line-narrow {
    background-color: #00000045;
    position: absolute;
    display: block;
    top: 1px;
    width: 100%;
    height: 1px;
}

.button-line-bold {
    position: absolute;
    display: block;
    top: 0px;
    width: 15px;
    height: 2px;
    background-color: #000;
    -o-transition: width 0.3s ease-in-out;
    -webkit-transition: width 0.3s ease-in-out;
    transition: width 0.3s ease-in-out;
}

.button-standard:hover .button-line-bold,
.hover-declenchor:hover .button-standard .button-line-bold {
    width: 100%;
}

.button-standard:hover,
.hover-declenchor:hover .button-standard {
    color: #000;
}

/************************************************************
	ACCUEIL MESSAGE
************************************************************/
.floating-smiley {
    width: 50px;
    height: 50px;
    background-color: red;
    position: absolute;
}

#corporate-identity {
    position: relative;
}

div#box-title {
    max-width: 685px;
    position: relative;
    z-index: 700;
    margin-left: 10%;
}

#smileys-communication {
    list-style-type: none;
}

#smileys-communication li {
    position: absolute;
}

#smileys-communication li img {
    width: 12vw;
}

#com-fun {
    top: 2%;
    right: 30%;
}

#com-out-box {
    bottom: 8%;
    right: 37%;
}

#com-passion {
    right: 11%;
    top: 37%;
}

#com-prestige {
    top: 3%;
    left: 1%;
}

.has-tip {
    border: 0px;
}

.tooltip {
    -webkit-transform: translate(-100%, 2%);
    transform: translate(-100%, 2%);
    display: none;
    position: absolute;
    color: #F0B015;
    background-color: #000;
    border: none;
    border-radius: 0px;
    padding: 25px 25px;
    z-index: 10;
    display: block;
    width: auto;
    max-width: none;
    top: 0;
    color: #fff;
    font-size: 55px;
    font-weight: 600;
    left: 50%;
    text-align: center;
    z-index: 700;
}

.tooltip.bg-blue {
    -webkit-transform: translate(2%, 2%);
    transform: translate(2%, 2%);
}

.tooltip.bg-red {
    -webkit-transform: translate(-100%, -100%);
    transform: translate(-100%, -100%);
}

.tooltip:after {
    display: none;
}

.tooltip.bg-yellow {
    background-color: #FFE900;
}

.tooltip.bg-pink {
    background-color: #FF13A4;
}

.tooltip.bg-pink {
    min-width: 450px;
}

.tooltip.bg-blue {
    background-color: #2594FF;
}

.tooltip.bg-red {
    background-color: #EF3434;
}






.letrucquibouge {
    width: 300px;
    height: 300px;
    background: rgb(255, 192, 0);
    background: radial-gradient(ellipse at center, #ffc000 0%, #ffac00 100%);
    border-radius: 50%;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    top: 50px;
    animation: move 20s infinite;
}

@keyframes move {
    0% {
        left: 0;
        top: 50vh;
        transform: translate(0, -50%) rotateZ(0);
    }

    25% {
        left: 50%;
        top: 0;
        transform: translate(-50%, 0) rotateZ(180deg);
    }

    50% {
        left: 100%;
        top: 50vh;
        transform: translate(-100%, -50%) rotate(360deg);
    }

    75% {
        left: 50%;
        top: 100vh;
        transform: translate(-50%, -100%) rotate(180deg);
    }

    100% {
        left: 0;
        top: 50vh;
        transform: translate(0, -50%) rotate(0);
    }
}



/************************************************************
	PAGINATION
************************************************************/
.pagination a,
.pagination button {
    display: inline;
}


.pagination .arrow {
    width: 66px;
}

.pagination {
    display: flex;
    justify-content: center;
    padding: 20px 0px;
    margin: 0 auto;
}

.pagination .current {
    background: #000;
}

.pagination a {
    color: #003298;
}

/************************************************************
	SERVICES
************************************************************/

#listing-services {
    margin-right: -1px;
}

.service a {
    background-color: #000;
    display: block;
}

.service.large-3 {
    padding-top: 25%;
}

.service.large-4 {
    padding-top: 33.333%;
}

.service.large-6 {
    padding-top: 50%;
}

.service {
    border-right: 1px solid #cccccc;
    border-bottom: 1px solid #cccccc;
    overflow: hidden;
    position: relative;
}

.postid-83 p.display-3 {
    transform: scale(0.8);
    transform-origin: left;
}

.postid-83 p.display-3 {
    font-size: 60px;
}

.bg-orange,
.bg-orange:not(.bubble):after {
    background-color: #ffa721 !important;
}

article.formule ul.bg-icon-orange li i {
    background-color: rgba(255, 167, 33, 0.353);
}

.bg.orange2 {
    background-color: #ff9933 !important;
}

.bg-orange3 {
    background-color: #cc6600 !important;
}

.bg-yellow,
.bg-yellow:not(.bubble):after {
    background-color: #ffd400 !important;
}

.bg-yellow-2 {
    background-color: #ffd400 !important;
}
a.small-button.cell.yellow {
    color: #000!important;
}
.bg-grey {
    background-color: #eee;
}
.bg-grey-soft {
    background-color: #f7f7f7;
}
.bg-green-wsigabs {
    background-color: #024772 !important;
}
.bg-green-wsigabs,
.bg-green-wsigabs:not(.bubble):after {
    background-color: #024772 !important;
}


article.formule ul.bg-icon-yellow li i {
    background-color: rgba(255, 212, 0, 0.353);
}

.bg-pink,
.bg-pink:not(.bubble):after {
    background-color: #FF13A4 !important;
}

article.formule ul.bg-icon-pink li i {
    background-color: rgba(255, 19, 164, 0.353);
}

.bg-pink2 {
    background-color: #b53f95 !important;
}

.bg-pink3 {
    background-color: #ff66cc !important;
}

.bg-blue,
.bg-blue:not(.bubble):after {
    background-color: #0082FF !important;
}

article.formule ul.bg-icon-blue li i {
    background-color: rgba(0, 130, 255, 0.353);
}

.bg-green,
.bg-green:not(.bubble):after {
    background-color: #0DC90F !important;
}

article.formule ul.bg-icon-green li i {
    background-color: rgba(74, 244, 28, 0.353);
}

.bg-turquoise,
.bg-turquoise:not(.bubble):after {
    background-color: #34EFCA !important;
}

article.formule ul.bg-icon-turquoise li i {
    background-color: rgba(52, 239, 202, 0.353);
}

.bg-purple,
.bg-purple:not(.bubble):after {
    background-color: #9900ff !important;
}

article.formule ul.bg-icon-purple li i {
    background-color: rgba(153, 0, 255, 0.353);
}

.bg-bleu1,
.bg-bleu1:not(.bubble):after {
    background-color: #6666ff !important;
}

.bg-bleu2 {
    background-color: #000099 !important;
}

.bg-bleu3 {
    background-color: #99ccff !important;
}

.bg-bleu4 {
    background-color: #33ccff !important;
}

.bg-bleu5 {
    background-color: #a9e5f0 !important;
}

.bg-green2 {
    background-color: #009966 !important;
}

.bg-green3 {
    background-color: #2e7357 !important;
}

.bg-green4 {
    background-color: #46e69d !important;
}

.bg-black {
    background-color: #000000 !important;
}

.bg-marron {
    background-color: #999966 !important;
}

.bg-saumon {
    background-color: #ffcc66 !important;
}

.bg-red,
.bg-red:not(.bubble):after {
    background-color: #EF3434 !important;
}

.bg-red2 {
    background-color: #993300 !important;
}

article.formule ul.bg-icon-red li i {
    background-color: rgba(239, 52, 52, 0.353);
}

.white {
    color: #ffffff !important;
}

.yellow {
    color: #f8da00 !important
}
.bg-green-wsigabs{
    color: #024772 !important;
}
.pink,
.link-pink:hover, .default-actived {
    color: #FF13A4 !important;
}
.bottom-arrow {
    transform: rotate(-90deg) !important;
    font-size: 17px;
    margin-left: 10px;
}
.border-color-pink {border-color: #FF13A4 !important;}
.border-color-orange {border-color: #ffa721 !important;}
.border-color-blue {border-color: #0082FF !important;}
.border-color-green {border-color: #0DC90F !important;}

.border-radius {border-radius: 14px;}

.border-color-pink:hover {background-color: #FF13A4 !important;}
.border-color-orange:hover {background-color: #ffa721 !important;color:white!important}
.border-color-blue:hover {background-color: #0082FF !important;}
.border-color-green:hover {background-color: #0DC90F !important;}

.pink2 {
    color: #b53f95 !important;
}

.pink3 {
    color: ff66cc !important;
}

.red {
    color: #EF3434 !important;
}

.blue {
    color: #0082FF !important;
}

.green,
.link-green:hover {
    color: #0DC90F !important;
}

.turquoise {
    color: #34EFCA !important;
}

.purple {
    color: #9900ff !important;
}

.orange {
    color: #ffa721 !important;
}

.orange2 {
    color: #ff9933 !important;
}

.orange3 {
    color: #cc6600 !important;
}

.bleu1 {
    color: #6666ff !important;
}

.bleu2 {
    color: #000099 !important;
}

.bleu3 {
    color: #99ccff !important;
}

.bleu4 {
    color: #33ccff !important;
}

.bleu5 {
    color: #a9e5f0 !important;
}

.green2 {
    color: #009966 !important;
}

.green3 {
    color: #2e7357 !important;
}

.green4 {
    color: #46e69d !important;
}

.marron {
    color: #999966 !important;
}

.saumon {
    color: #ffcc66 !important;
}

.red2 {
    color: #993300 !important;
}

.blue2 {
    color: #34b3ef !important;
}

.strong {
    font-weight: 700;
}

.black {
    color: #000;
}

a.black:hover {
    color: #0DC90F;
}

.service a {
    background-color: #000;
    color: #fff;
    display: block;
    border-radius: 50%;
    text-align: center;
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
    width: 80%;
    height: 80%;
    transition: all ease-in-out 0.5s;
}

.cell.service.fullheight {
    min-height: 100vh;
    padding-top: 0px;
}

.cell.service.fullheight .fullheight-contain {
    width: 100%;
    padding-top: 100%;
    position: relative;
}

.service a {
    background-color: transparent;
}

.service a:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all ease-in-out 0.5s;
}

.service:hover a::after {
    height: 200%;
    width: 200%;
}

.service.fullheight:hover a::after {
    height: 140vh;
    width: 140vh;
}

.service.large-6 {
    padding-top: 50%;
}


.service a .h2-2 {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 90%;
    transform: translate(-50%, -50%);
    transition: all ease-in-out 0.5s;
    max-width: 300px;
    z-index: 500;
}

.excerpt {
    opacity: 0;
    position: absolute;
    bottom: 0px;
    color: #fff;
    width: 100%;
    padding: 20px;
    transition: all 0.5s ease;
    transition-delay: 0.3s;
    transform: translateY(40px);
}

.excerpt p:last-child {
    margin-bottom: 0px;
}

.service:hover .excerpt {
    opacity: 1;
    transform: translateY(0px);
}

svg#drapeau-suisse {
    padding: 0px;
    width: 25px;
    height: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    font-size: 12px;
    margin-bottom: 25px;
}

#container-prestation {
    overflow: hidden;
    margin-left: -135px;
    width: calc(100% + 185px);
    max-width: none;
    padding: 50px;
}

#container-prestation .section-prestation {
    padding: 78px 50px;
}

.button-standard+.button-standard {
    margin-top: 2rem;
}

/************************************************************
	SINGLE SERVICES
************************************************************/
#color-round-presentation,
.color-round-presentation {
    width: 100vh;
    height: 100vh;
    background-color: #FF13A4;
    border-radius: 50%;
    display: block;
    position: absolute;
    left: -85px;
    top: 0%;
    transform: translate(-50%, 0%);
}

.section-prestation.right .color-round-presentation {
    left: initial;
    right: 50px;
    transform: translate(50%, 0%);
}

section#section-presentation {
    max-width: 1400px;
    position: relative;
}

img#presentation-image,
#infos-presentation {
    position: relative;
}

div#infos-text {
    max-width: 376px;
    /*align-self: center;*/
}

.round-image {
    border-radius: 50%;
    overflow: hidden;
}

#section-round-image .h1 {
    margin-left: -50%;
    position: relative;
}

.round-image {
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    padding-top: calc(58.33333% - 1.875rem);
    height: 0px;
}

.round-image img {
    position: absolute;
    left: 0px;
    display: block;
    max-width: none;
    top: 50%;
    transform: translateY(-50%);
    width: 158%;
}

/*#color-round-service-CTA {
    width: 30vw;
    height: 30vw;
    border-radius: 50%;
    position: relative;
    left: -30vw;
    transform: translate(-50%, 0);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
}*/
#color-round-service-CTA {
    width: 30vw;
    height: 30vw;
    border-radius: 50%;
    position: relative;
    margin: auto;
    box-shadow: 0 0 0 0 rgb(0 0 0);
}

#infos-cta-2 {
    max-width: 500px;
    margin: 0 auto;
}

#section-call-action-2 .padding {
    width: 100%;
}

#color-round-service-CTA:hover {
    filter: invert(100%);
    -webkit-filter: invert(100%);
}

#color-round-service-CTA span {
    color: #fff;
    font-size: 55px;
    font-weight: 600;
    text-align: center;
    line-height: 1.3;
    padding: 0px 40px;
}

#color-round-service-CTA.bg-yellow span {
    color: #000;
}

#color-round-service-CTA span.bubble {
    padding: 20px 23px;
}

#infos-cta {
    position: relative;
    opacity: 0;
    max-width: 340px;
    align-self: center;
}

section#section-call-action {
    padding: 0vh 0 8rem 0;
}

section#section-round-image {
    padding: 10vh 0px 5vh 0px;
}

section#section-contact img {
    width: 33%;
}

section#section-contact p.wordtitle {
    margin-top: 90px;
}

section#section-contact i.icon-im_contact {
    font-size: 560px;
    filter: invert(100%);
    -webkit-filter: invert(100%);
}

p.wordtitle a,
.address a {
    color: initial;
    /*border-bottom: 6px dotted #c7c7c7;*/
}

p.wordtitle a:hover,
.address a:hover {
    color: #0DC90F;
}

section#section-contact i.icon-im_contact:hover {
    filter: none;
    -webkit-filter: none;
}

.tooltipLink {
    background-color: transparent !important;
}

/************************************************************
	DOCUMENTATION 2
************************************************************/
#section-documentation i {
    font-size: 240px;
    display: block;
    margin-bottom: 30px;
}

i.icon-explorateur span:before {
    color: #0082FF !important;
}

.bubble:after {
    content: "";
    width: 30px;
    height: 30px;
    border-right: solid 15px transparent;
    border-top: solid 15px transparent;
    display: block;
    transform: rotate(90deg);
    position: absolute;
    bottom: -20px;
}

.bg-orange.bubble:after {
    border-bottom: solid 15px #ffa721;
    border-left: solid 15px #ffa721;
}

.bg-red.bubble:after {
    border-bottom: solid 15px #EF3434;
    border-left: solid 15px #EF3434;
}

.bg-pink.bubble:after {
    border-bottom: solid 15px #FF13A4;
    border-left: solid 15px #FF13A4;
}

.bg-green.bubble:after {
    border-bottom: solid 15px #0DC90F;
    border-left: solid 15px #0DC90F;
}

.bg-black.bubble:after {
    border-bottom: solid 15px #000000;
    border-left: solid 15px #000000;
}

.bg-turquoise.bubble:after {
    border-bottom: solid 15px #34EFCA;
    border-left: solid 15px #34EFCA;
}

.bg-blue.bubble:after {
    border-bottom: solid 15px #0082FF;
    border-left: solid 15px #0082FF;
}

.bg-yellow.bubble:after {
    border-bottom: solid 15px #ffd400;
    border-left: solid 15px #ffd400;
}

.bg-green-wsigabs.bubble:after {
    border-bottom: solid 15px #024772;
    border-left: solid 15px #024772;
}

section#section-documentation .grid-container {
    position: relative;
    top: 50px;
}

.bloc-info a.cell.shrink {
    max-width: 100%;
    margin-right: 0px;
}

/* GEEK */
.bubble:nth-child(1) {
    transform: scale(0) rotate(105deg);
    top: -45px;
    left: 90px;
}

.bubble:nth-child(2) {
    transform: scale(0) rotate(-95deg);
    top: 0px;
    left: 275px;
}

/* ARTISTE */
section#section-documentation .cell:nth-child(3) .bubble:nth-child(3) {
    transform: scale(0) rotate(-95deg);
    top: 0px;
    left: 244px;
}

/* EXPLORATEUR */
section#section-documentation .cell:nth-child(4) .bubble:nth-child(4) {
    transform: scale(0) rotate(-95deg);
    top: 0px;
    left: 244px;
}

section#section-documentation:not(.sitemap) .cell:nth-child(4) .speak {
    right: -70px;
    width: 510px;
}

#section-documentation .speak {
    position: absolute;
    top: -70px;
    width: 620px;
}

@keyframes booooing1 {
    0% {
        transform: scale(0) rotate(105deg);
    }

    30% {
        transform: scale(1) rotate(-40deg);
    }

    50% {
        transform: scale(1) rotate(-5deg);
    }

    75% {
        transform: scale(1) rotate(-20deg);
    }

    85% {
        transform: scale(1) rotate(-12deg);
    }

    100% {
        transform: scale(1) rotate(-15deg);
    }
}

@keyframes booooing2 {
    0% {
        transform: scale(0) rotate(95deg);
    }

    30% {
        transform: scale(1) rotate(-30deg);
    }

    50% {
        transform: scale(1) rotate(5deg);
    }

    75% {
        transform: scale(1) rotate(-10deg);
    }

    85% {
        transform: scale(1) rotate(-2deg);
    }

    100% {
        transform: scale(1) rotate(-5deg);
    }
}

@keyframes swuuush {
    0% {
        transform: scale(1) rotate(-15deg);
    }

    100% {
        transform: scale(0) rotate(105deg);
    }
}

.bubble {
    font-size: 40px !important;
    color: #fff;
    font-weight: 900 !important;
    text-transform: uppercase;
    padding: 20px 23px;
    line-height: 1;
    position: absolute;
    transform-origin: bottom left;
}

#section-documentation a .bubble.close,
#color-round-service-CTA .bubble.close {
    animation-name: swuuush;
    animation-duration: 0.3s;
    /* or: Xms */
    animation-direction: alternate;
    /* or: normal */
    animation-timing-function: ease-out;
    /* or: ease, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) */
    animation-fill-mode: forwards;
    /* or: backwards, both, none */
    animation-delay: 0s;
    /* or: Xms */
}

#section-documentation a:hover .bubble:nth-child(1),
#color-round-service-CTA:hover .bubble:nth-child(1) {
    animation-name: booooing1;
    animation-duration: 0.6s;
    /* or: Xms */
    animation-direction: alternate;
    /* or: normal */
    animation-timing-function: ease-in-out;
    /* or: ease, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) */
    animation-fill-mode: forwards;
    /* or: backwards, both, none */
    animation-delay: 0s;
    /* or: Xms */
}

#section-documentation a:hover .bubble:nth-child(2),
#color-round-service-CTA:hover .bubble:nth-child(2) {
    animation-name: booooing2;
    animation-duration: 0.6s;
    /* or: Xms */
    animation-direction: alternate;
    /* or: normal */
    animation-timing-function: ease-in-out;
    /* or: ease, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) */
    animation-fill-mode: forwards;
    /* or: backwards, both, none */
    animation-delay: 0.3s;
    /* or: Xms */
}

#color-round-service-CTA .speak {
    filter: invert(100%);
    -webkit-filter: invert(100%);
}

#color-round-service-CTA span.bubble {
    font-size: 30px;
}

#color-round-service-CTA p.speak {
    position: absolute;
    top: 0px;
    left: 0px;
}

/************************************************************
	BLOG
************************************************************/
#journal-parent i,
#journal-single #main-icon i {
    font-size: 240px;
    display: block;
    margin-bottom: 30px;
}

.archive .title-block h2.h3 {
    margin-right: 0.5rem;
}

.blog p,
.blog ul {
    font-size: 1rem;
    margin-bottom: 2.5rem;
    font-weight: 400;
    line-height: 1.8;
}

div#journal-parent,
#journal-single {
    margin-top: 200px;
    position: relative;
}

#journal-single {
    margin-bottom: 100px;
}

.article-blog a {
    color: #000;
}

hr {
    border-bottom: 1px solid #e5e5e5;
}

article picture img {
    margin-bottom: 30px;
}

.info-txt {
    color: #767b80;
}

#journal-parent .bubble:nth-child(1) {
    top: -115px;
    left: 150px;
    animation-name: booooing1;
    animation-duration: 0.6s;
    /* or: Xms */
    animation-direction: alternate;
    /* or: normal */
    animation-timing-function: ease-in-out;
    /* or: ease, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) */
    animation-fill-mode: forwards;
    /* or: backwards, both, none */
    animation-delay: 0s;
    /* or: Xms */
}

#journal-parent .bubble:nth-child(2) {
    top: -50px;
    left: 325px;
    animation-name: booooing2;
    animation-duration: 0.6s;
    /* or: Xms */
    animation-direction: alternate;
    /* or: normal */
    animation-timing-function: ease-in-out;
    /* or: ease, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) */
    animation-fill-mode: forwards;
    /* or: backwards, both, none */
    animation-delay: 0.3s;
    /* or: Xms */
}

div#journal-list {
    margin-top: 100px;
}

.category-le-journal-du-geek a.small-button.cell.shrink {
    color: #FF13A4;
}

.category-le-journal-du-geek a.small-button.cell.shrink:hover {
    background-color: #00000012;
}

div#journal-single.geek a {
    color: #FF13A4;
}

div#journal-artiste.geek a {
    color: #0DC90F;
}

div#journal-explorateur.geek a {
    color: #0082FF;
}

a.list-event-article i {
    font-size: 23px;
    margin-right: 10px;
}

/************************************************************
	BLOG NAV
************************************************************/
#blog-nav {
    position: fixed;
    z-index: 1500;
    top: 50%;
    transform: translateY(-50%);
    background: #e4e4e4;
    padding: 10px 0px;
    -webkit-border-top-right-radius: 50px;
    -webkit-border-bottom-right-radius: 50px;
    -moz-border-radius-topright: 50px;
    -moz-border-radius-bottomright: 50px;
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
}

svg#corner-top {
    position: absolute;
    top: -40px;
    left: 0px;
    width: 40px;
    transform: rotate(-180deg);
}

ul#blog-nav a {
    padding: 24px 30px;
}

svg#corner-bottom {
    position: absolute;
    bottom: -40px;
    width: 40px;
}

ul#blog-nav i,
ul#blog-nav i.icon-explorateur span:before {
    font-size: 50px;
}

ul#blog-nav a:not(.active) i,
ul#blog-nav a:not(.active) i.icon-explorateur span:before {
    color: #000 !important;
}

ul#blog-nav a span.title-nav {
    display: none;
    position: absolute;
    max-width: none;
    color: #000;
    text-align: center;
    transform: rotate(-90deg);
    transform-origin: center center;
}

/************************************************************
	TARIFS
************************************************************/
.tarif-grid {
    width: 100%;
    display: flex;
    margin-bottom: 50px;
}

.tarif-grid ul {
    list-style-type: none;
    margin: 0px;
}

.tarif-grid ul li {
    display: flex;
    border-bottom: 1px solid #cccccc;
    padding: 20px 0px;
    /*margin-left: 0px!important;
    padding-left: .9375rem;*/
}

.tarif-grid ul li p,
.tarif-grid ul li .p {
    margin: 0px;
}

.tarif-grid ul li p.price {
    margin-right: 15px;
    display: block;
    min-width: 150px;
    font-size: 23px;
    font-family: 'Roboto', Helvetica, Arial, sans-serif;
    font-weight: 900;
}

.tarif-grid h3 {
    font-size: 16px;
}

.tarif-grid ul li p.price sup {
    font-size: 55%;
}

h2.small-caps {
    transform: rotate(-90deg);
    /* text-align: right; */
    /* min-width: calc(100vh - 84px); */
    transform-origin: left;
    position: absolute;
    left: 0px;
    top: 0px;
}

.tarif-grid header .small-caps {
    transform: rotate(-90deg);
    text-align: right;
    width: 300px;
    transform-origin: left;
    position: absolute;
    left: -13px;
    top: 291px;
}

.tarif-grid header {
    border-right: 1px solid;
    position: relative;
}

.tarif-grid header .small-caps span {
    border-bottom: 3px solid;
    padding-bottom: 3px;
}

.tarif-grid.turquoise ul li a:hover h3,
.tarif-grid.turquoise ul li a:hover p {
    color: #34EFCA !important;
}

.tarif-grid.pink ul li a:hover h3,
.tarif-grid.pink ul li a:hover p {
    color: #FF13A4 !important;
}

.tarif-grid.orange ul li a:hover h3,
.tarif-grid.orange ul li a:hover p {
    color: #ffa721 !important;
}

.tarif-grid.blue ul li a:hover h3,
.tarif-grid.blue ul li a:hover p {
    color: #0082FF !important;
}

.tarif-grid.purple ul li a:hover h3,
.tarif-grid.purple ul li a:hover p {
    color: #9900ff !important;
}

.tarif-grid.green ul li a:hover h3,
.tarif-grid.green ul li a:hover p {
    color: #0DC90F !important;
}

.tarif-grid table tbody td {
    height: auto;
}

.tarif-grid table tbody tr:last-child td {
    border-bottom: 0px;
}

.tarif-grid.table ul li {
    flex-direction: column;
}

.tarif-grid.table ul li p.price {
    margin: 0px 0px 10px 8px;
}

/************************************************************
	CONTACT
************************************************************/
section#section-contact p.wordtitle {
    font-size: 20px;
}

section#section-contact .wordtitle span:last-child {
    font-size: 75px;
    bottom: 13px;
}

.address span {
    font-weight: bold;
}

/************************************************************
	PORTFOLIO
************************************************************/
.accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle)>a::after {
    border-color: #000000 transparent transparent;
}

.accordion-menu .is-accordion-submenu-parent:not(.has-submenu-toggle)>a::after {
    right: 5px;
}

.accordion-menu a {
    padding: .7rem 1.5rem .7rem 1rem;
}

.is-accordion-submenu {
    margin-bottom: 20px;
}

#projets-menu ul li.is-submenu-item {
    transition: all ease-in 0.2s;
    margin-left: 0px;
}

#projets-menu ul li.is-submenu-item:hover {
    margin-left: 10px;
}

img#main-projet-image {
    width: 100%;
}

#projets-menu ul li.is-submenu-item a {
    color: #000;
}

#projets-menu ul li.is-submenu-item:hover a {
    color: #0DC90F;
}

.accordion-menu .is-accordion-submenu li {
    padding: .4rem 1rem .4rem 0.2rem;
    line-height: 1;
}

.accordion-menu .is-accordion-submenu a {
    padding: 0px;
    line-height: 1;
}

button#pb-link-projet {
    display: none !important;
}

.single-projet-content {
    max-width: 850px;
}

/************************************************************
	CLIENTS
************************************************************/
table tbody td {
    border: solid 1px #e4e4e4;
    padding: 10px;
    /*height: 140px;*/
    width: 180px;
}

table #tarifs  tbody td {
    border: solid 1px #e4e4e4;
    padding: 10px;
}
table tbody tr td:first-child {
    border-left: solid 0px #fff;
}

table tbody tr:first-child td {
    border-top: solid 0px #fff;
}

table tbody tr td:last-child {
    border-right: solid 0px #fff;
}

td {
    transition: background 0.5s ease;
}

td:hover {
    background-color: #fff;
}

table tbody tr:nth-child(even) {
    border-bottom: 0;
    background-color: transparent;
}

table tbody,
table tfoot,
table thead {
    border: 0px;
}

table tbody td img {
    margin: 0 auto;
    display: block;
    max-height: 40px;
}

/************************************************************
	POSITIONNEMENT IMAGES SERVICES
************************************************************/
section#section-presentation .grid-x {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

/************************************************************
	404
************************************************************/
div#visuel404 {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

span.number404 {
    font-size: 300px;
    font-weight: bold;
    line-height: 1;
}

div#visuel404 img {
    width: 270px;
    position: relative;
    bottom: 12px;
}

/************************************************************
	CURSOR
************************************************************/
/*html,
html *,
body,
body * {
    cursor: none;
}

.cursor-dot,
.cursor-dot-outline {
    pointer-events: none;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 200000;
    border-radius: 50%;
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}

.cursor-dot {
    width: 8px;
    height: 8px;
    background-color: #000;
}

.cursor-dot.white {
    background-color: #fff;
}

.cursor-dot-outline {
    width: 40px;
    height: 40px;
    background-color: #00000070;
}

.cursor-dot-outline.white {
    background-color: #ffffff70;
}
*/

section#section-emotion-projet img {
    width: 50%;
    max-height: 100%;
    min-height: 50%;
    position: absolute;
    top: -18vh;
    left: -5vw;
    transform: rotate(-15deg);
}

section#section-emotion-projet {
    min-height: 70vh;
    position: relative;
    margin-left: .9375rem;
    margin-right: .9375rem;
    align-items: center;
}

section#section-emotion-projet .wordtitle {
    transform: rotate(-12deg);
    margin-top: 15vh;
}

.page-id-551 div#left-head {
    z-index: 1000;
    background-color: #fff;
}

svg#long-arrow {
    position: absolute;
    width: 25px;
    right: 10%;
    bottom: 10%;
    animation: 2s ease 1s infinite alternate upDown;
}

.bloc-titre-projet {
    margin-bottom: .5rem;
}

.bloc-projet {
    background-size: cover;
    background-position: center center;
    border: 1px solid #e7eaf3 !important;
    padding: 2rem;
}

.bloc-projet br {
    display: none;
}

@keyframes upDown {
    from {
        bottom: 10%;
    }

    to {
        bottom: 5%;
    }
}

h3.titre-projet.small-caps.black {
    margin-bottom: 0px;
}

a.projet-link i.round {
    padding: 11px;
    font-size: 14px;
}

.projet-categorie {
    margin-bottom: 10vh;
}

.bloc-projet {
    display: flex;
    flex-direction: column;
}

.bloc-content-projet {
    flex-grow: 1;
}

a.projet-link {
    margin-right: .5rem;
}

i.round.icon-external-link-regular {
    background-color: #0DC90F;
}

.single-projets main article.projets a {
    color: #ff13a4 !important;
}

.bouton-utilitaire i.round {
    padding: 20px;
    font-size: 21px;
    background-color: #ff13a4;
}

/************************************************************
	COOKIES
************************************************************/
div#cookie-notice {
    width: 15%;
    background-color: #000000 !important;
    min-width: 230px;
    right: 85px;
    left: initial;
    -webkit-border-top-left-radius: .8rem;
    -webkit-border-top-right-radius: .8rem;
    -moz-border-radius-topleft: .8rem;
    -moz-border-radius-topright: .8rem;
    border-top-left-radius: .8rem;
    border-top-right-radius: .8rem;
}

span#cn-notice-text {
    font-size: 1.5rem;
    font-weight: 600 !important;
    margin-bottom: 1.4rem;
    width: 100%;
}

.cn-button.bootstrap {
    color: #000;
    background: #ffffff;
}

span#cn-notice-text img {
    max-width: 100px;
    display: block;
    margin: 0 auto 40px auto;
}

.cn-close-icon {
    right: 15px;
    top: 15px;
    margin-top: 0px;
}

span#cn-notice-buttons a#cn-accept-cookie {
    width: 100%;
    margin-left: 0px;
}

span#cn-notice-buttons {
    width: 100%;
}

#cookie-notice a#cn-more-info {
    background: transparent !important;
    margin-left: 0px;
    box-shadow: none;
}

nav.single-nav {
    margin: 2rem 0rem 3rem 0rem;
}

.bouton-utilitaire.back i.round {
    background-color: #000000;
}

#portfolio-2 .large-shrink {
    display: flex;
    flex-direction: column;
    justify-content: end;
}

#portfolio-2 .large-auto .titre-1 {
    font-size: 38px;
    line-height: 1;
}

.bouton-utilitaire.back {
    margin-right: .5rem;
}

section#cta-services>div,
.single-cta>div {
    max-width: 830px;
}

a.button.button-black {
    background-color: #000;
}

a.button {
    font-size: 1.3rem;
    padding: 1.3rem;
}

.button-standard.big {
    font-size: 20px;
    margin-top: 1rem;
    letter-spacing: .05em;
}

button.button-standard.big {
    line-height: 1.4;
}

i.icon-arrow-left-regular.right {
    transform: rotate(180deg);
    display: inline-block;
}

a.button-standard.big i.icon-arrow-left-regular.right {
    font-size: 80%;
}

a.button-standard.big .button-line {
    margin-top: 10px;
}

img.img-service {
    position: relative;
    width: 100%;
    opacity: 0;
    right: 0;
}

section#section-services-photo img.img-service {
    width: calc(100% + 80px);
    margin-left: -90px;
    max-width: none;
}

#section-services-web img.img-service {
    width: calc(100% + 200px);
    margin-left: -140px;
    max-width: none;
}

section#section-services-graphisme img.img-service {
    width: calc(100% + 200px);
    margin-left: -140px;
    max-width: none;
}

#section-services-marketing img.img-service {
    width: calc(100% + 200px);
    margin-left: -140px;
    max-width: none;
}

section#section-services-photo img.img-service {
    max-width: 530px;
}

/*section#section-services-animation .display-4 {
    font-size: 105px;
}*/
.section-services p.display-4 {
    position: relative;
    left: -50%;
}

.infos-service {
    left: 130px;
}

.icon-facebook-f-brands:before {
    font-size: 75%;
}

#section-documentation a {
    position: relative;
    display: block;
}

#section-documentation p.display-3 {
    margin-bottom: 40px;
}

.page-template-page-journal #section-documentation p.display-3 {
    display: none;
}

.pagination {
    display: -ms-flexbox;
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: .3125rem;
}

a.page-numbers {
    background-color: #e6e6e6;
    color: #545454;
    font-weight: 500;
    padding: 23px 16px;
    margin: 4px;
    font-size: 20px;
    line-height: 0;
}

a.prev.page-numbers,
a.next.page-numbers {
    background-color: transparent;
    font-size: 16px;
}

span.page-numbers.current {
    background-color: #ff0000;
    color: #fff;
    font-weight: 500;
    padding: 22px 20px;
    margin: 4px;
    font-size: 20px;
    line-height: 0;
}

a.page-numbers:hover {
    color: #fff;
    background-color: #ff0000;
}

a.prev.page-numbers:hover,
a.next.page-numbers:hover {
    background-color: transparent !important;
    color: #1f1f1f;
}

.pagination {
    justify-content: center;
    margin-top: 2rem;
}

span.page-numbers.dots {
    background-color: #f9f9f9;
    color: #545454;
    font-weight: 500;
    padding: 23px 16px;
    margin: 4px;
    font-size: 20px;
    line-height: 0;
}

.category-le-journal-du-geek a.page-numbers:hover,
.category-le-journal-du-geek span.page-numbers.current {
    background-color: #FF13A4;
}

.category-le-journal-du-manager a.page-numbers:hover,
.category-le-journal-du-manager span.page-numbers.current {
    background-color: #ffa721;
}

.category-le-journal-de-lartiste a.page-numbers:hover,
.category-le-journal-de-lartiste span.page-numbers.current {
    background-color: #0DC90F;
}

.category-le-journal-de-lexplorateur a.page-numbers:hover,
.category-le-journal-de-lexplorateur span.page-numbers.current {
    background-color: #0082FF;
}

.single-cta {
    padding: 50px 30px !important;
}

#portfolio-cta-img {
    position: relative;
}

#portfolio-cta-img:after {
    content: "";
    background-color: #fff;
    display: block;
    position: absolute;
    width: 100%;
    height: 50%;
    top: 0%;
    z-index: 100;
}

div#portfolio-cta-img img {
    position: relative;
    z-index: 600;
    margin: 0 auto;
    display: block;
    max-width: 74%;
}

section#portfolio-cta-image .single-cta {
    padding: 7vh 0rem 6vh 0rem !important;
}

.single div#listing-services {
    border-top: 1px solid #cccccc;
}

.single-cta {
    margin: 0px 30px;
}

form.inf-form>div {
    background-color: transparent;
    padding: 0px;
}

.inf-rgpd {
    font-size: .6rem;
}

.inf-content {
    position: relative;
}

.inf-submit {
    position: absolute;
    top: 0px;
    right: 0px;
}

.inf-submit input {
    background-color: #000 !important;
    font-weight: bold !important;
    padding: 24px !important;
}

.inf-content input[type="text"] {
    font-size: 1.3rem;
    padding: 2rem;
}

.page-template-page-newsletter-confirmation section#section-emotion img,
.page-template-page-newsletter-validation section#section-emotion img {
    max-height: 40vh;
    height: auto;
    width: auto;
}

.w-75 {
    max-width: 770px;
    margin: 0 auto;
}

.section-list-i .i img {
    width: 80px;
    margin-bottom: 30px;
}

div#list {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    justify-content: center;
}

div#list .tooltip-html.i {
    display: flex;
    align-items: center;
    max-width: 440px;
    margin-left: .9375rem;
    margin-right: .9375rem;
    width: calc(50% - 1.875rem);
    margin-bottom: 40px;
}

div#list .tooltip-html.i>p.service-i-vertical {
    display: none;
}

.section-list-i .i img {
    width: 80px;
    margin-bottom: 30px;
}

.titre-1,
#listing-projets h2,
#listing-projets-abt h2 {
    font-size: 55px;
    margin-bottom: 0rem;
    font-weight: 600;
}

.keypoints p {
    font-size: .85rem;
}

.keypoint a {
    color: #000;
    text-decoration: underline;
}

.keypoint a:hover {
    color: #0DC90F;
}

.round-shadow {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 120px;
    margin: 0rem auto 2rem auto;
    border-radius: 100%;
    -webkit-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.05);
}

.single-services .display-3,
#section-presentation .display-3 {
    font-size: 60px;
}

section#section-keypoints {
    max-width: 1175px;
}

.single-services #infos-text,
#section-presentation #infos-text {
    max-width: 570px;
    font-size: 16px;
    font-weight: 400;
    margin-top: 1rem;
}

.keypoint-title {
    padding: 0rem 3rem;
}

#section-keypoints .h2,
.titre-2 {
    font-size: 21px;
    font-weight: 600;
}

section#section-contact img {
    width: 200px;
    max-width: 100%;
}

#section-documentation.sitemap i {
    font-size: 100px;
}

#section-documentation.sitemap .bubble {
    font-size: 19px;
}

#section-documentation.sitemap .bubble:nth-child(1) {
    left: 20px;
}

#section-documentation.sitemap .bubble:nth-child(2) {
    left: 125px;
}

#section-documentation.sitemap {
    overflow: hidden;
}

#section-documentation.sitemap img.smiley {
    max-width: 100px;
    width: 100%;
    margin: 0 auto;
    display: block;
    margin-bottom: 30px;
}

#section-documentation.sitemap .cell:nth-child(6) .bubble:nth-child(2) {
    left: 95px;
    top: -20px;
}

@media print,
screen and (min-width: 1200px) {
    #section-documentation.sitemap .grid-x>.large-4 {
        width: 20%;
    }
}

#section-documentation.sitemap p.display-3 {
    margin-bottom: 60px;
}

.page-template-page-sitemap a {
    color: #000;
}

.page-template-page-sitemap a:hover {
    color: #ef3434;
}

.page-template-page-sitemap i.icon-arrow-left-regular.right {
    margin-right: 5px;
    font-size: 12px;
}

section.links {
    max-width: 890px;
    margin: 0 auto;
}

.links h2.h2 {
    margin-bottom: 40px;
}

i.round.icon-sitemap {
    padding: 0px;
    width: 25px;
    height: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    font-size: 12px;
    margin-bottom: 43px;
}

#main-menu .link {
    position: relative;
    z-index: 1000;
}

#swissflag:hover svg * {
    fill: red;
}

a.link.sitemap {
    background-color: #fff;
}

.link.sitemap:hover i {
    background-color: #0DC90F;
}

#portraits {
    position: relative;
}

img#ask-dimi {
    position: absolute;
    top: -20px;
    right: -170px;
}

#image-main img,
.image-main img {
    max-width: none;
    max-height: 100vh;
}

#map-interactiv {
    height: 100%;
    width: auto;
}

#interactiv-map .grid-x {
    align-items: stretch !important;
}

#image-main,
.image-main {
    overflow: hidden;
    position: relative;
    left: 50px;
}

section#accueil-main .title-1 {
    font-size: 47px;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

section#accueil-main .cell:not(.image-main) {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.address {
    margin-top: 90px;
}

#team img {
    max-width: 120px;
    margin: 0 auto 20px auto;
    display: block;
    width: 80%;
}

/************************************************************
	MAP
************************************************************/
svg#map-interactiv path {
    fill: #2E332E !important;
}

svg#map-interactiv path.active {
    fill: #000 !important;
}

svg#map-interactiv path.active:hover {
    fill: #2E332E !important;
    cursor: pointer;
}

.map-container {
    position: relative;
    display: flex;
}

.map-container .point {
    cursor: pointer;
    position: absolute;
    width: 2rem;
    height: 2rem;
    transition: all .3s ease;
    will-change: transform, box-shadow;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 0 rgba(0, 172, 193, 0.4);
    animation: pulse 3s infinite;
}

.map-container .point-decouvertes .popover {
    margin-bottom: 0px;
    padding-bottom: 0px;
}

.map-container #point-fribourg {
    top: 52%;
    left: 26.5%;
}

a#point-lausanne {
    top: 59%;
    left: 13.5%;
}

a#point-montreux {
    top: 65%;
    left: 21.5%;
}

a#point-yverdon {
    top: 47%;
    left: 16.5%;
}

a#point-geneve {
    top: 74%;
    left: 3.5%;
}

/*#interactiv-map h2 {
    font-size: 34px;
}*/
section#interactiv-map .grid-x {
    align-items: flex-start;
}

/************************************************************
	OFFRE
************************************************************/
#offre {
    height: auto;
    min-height: 840px;
    position: relative;
}

span#votre-site {
    font-size: 67px;
    font-weight: 600;
}

#offre-faq h2 {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;
}

span#montant {
    font-size: 235px;
    font-weight: bold;
    letter-spacing: -0.5rem;
    color: #ffd400;
    line-height: 0.9;
}

span#prix {
    position: relative;
    display: inline-block !important;
}

span#devise {
    position: absolute;
    top: 46px;
    right: -76px;
    transform: rotate(-90deg);
    font-weight: bold;
    font-size: 27px;
    color: #ffd400;
}

span#seulement,
span#monthly {
    font-size: 27px;
    font-weight: bold;
}

#b-2,
#b-3 {
    display: flex;
}

a#offre {
    color: #0a0a0a;
}

#offre h1#title,
#offre #title-container {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    max-width: 800px;
    margin: 0 auto;
    z-index: 1000;
    position: absolute;
    left: 50%;
    width: 100%;
    transform: translateX(-50%);
}

h2#title {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

img#main-image {
    width: 100%;
    max-width: 1000px;
    position: absolute;
    top: 170px;
    left: 50%;
    transform: translateX(-80%);
}

div#left-head {
    z-index: 1000;
}

#offre-faq.single-cta>div {
    max-width: 830px;
    width: 100%;
}

.accordion {
    background-color: transparent;
}

#offre-faq.single-cta .accordion-content a,
.accordion-title:focus,
.accordion-title:hover {
    color: blue;
}

#offre-faq {
    padding: 8rem 30px !important;
    min-height: auto;
}

.accordion-content ul {
    margin-bottom: 1rem;
}


#offre button.button-standard.big {
    margin-top: 40px;
}

#offre.include img#main-image {
    transform: translateX(-82%);
}

#pastille {
    background-color: #ffd400;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.7rem;
    text-align: center;
    font-weight: 600;
    top: 140px;
    transform: rotate(-15deg);
    left: -120px;
    z-index: 500;
    line-height: 1.4;
}

.page-template-page-forfait-abt #accueil-main {
    padding-top: 0px;
}

/* CUSTOM EQS : CONTENT ACCORDEON */
.accordion-title {
    font-size: 21px;
    font-weight: bold;
    line-height: 1.44444444;
    color: #000000;
    border: 0px;
    border-top: 1px solid #ffffff96;
    border-radius: 0px;
    padding: 1.25rem 3rem 1.25rem 1rem;
}

:last-child:not(.is-active)>.accordion-title {
    border-bottom: 1px solid #ffffff96;
}

.accordion-title:focus,
.accordion-title:hover {
    background-color: transparent;
}

.accordion-content {
    border: 0px;
    background-color: transparent;
    padding-top: 0px;
}

.accordion-content h3 {
    font-size: 14px;
    font-weight: bold;
    color: #000000;
}

.accordion-title::before {
    position: absolute;
    top: 50%;
    right: 1rem;
    margin-top: 0px;
    content: '+';
    transform: translate(0px, -50%);
}

#abonnement-tarifs>div {
    max-width: initial;
}

article.formule {
    background-color: #fff;
    border-radius: 1rem;
    padding: 2rem;
}

article.formule li {
    padding: 10px 0px;
    border-bottom: 1px solid #eee;
    display: flex;
}

article.formule ul {
    list-style-type: none;
    margin: 0px;
}

article.formule li i {
    background-color: rgba(255, 212, 0, 0.369);
    width: 24px;
    height: 24px;
    min-width: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    margin-right: 10px;
    font-size: 0.7rem;
}

article.formulewsigabs li i {
    background-color: #024772!important;
    color: #fff!important;
}
.formule-starter {
    font-weight: bold;
    font-size: 12px;
    text-align: center;
    text-transform: uppercase;
}

.formule a {
    color: #d4970d;
}

article.formule li span {
    margin-top: 3px;
}

article.formule li.desactive>* {
    opacity: 0.4;
}

.formule h3 {
    font-weight: 400;
    margin-bottom: 1rem;
}
p.formule-prix {
    display: flex;
    align-items: end;
    line-height: 0.65;
}

span.fp-1 {
    display: flex;
    margin-left: -50px;
}

span.prix {
    position: relative;
    display: inline-block !important;
}

span.montant {
    font-size: 40px;
    font-weight: bold;
    letter-spacing: -0.3rem;
    color: #ffd400;
    line-height: 0.9;
}
.montantwsigabs {
    color: #024772 !important;
}

span.devise {
    position: absolute;
    top: 15px;
    right: -67px;
    transform: rotate(-90deg);
    font-weight: bold;
    font-size: 14px;
    color: #ffd400;
    text-align: right;
}
.devisewsigabs{
    color: #024772 !important;
}

.bluewsigabs{
    color: #024772 !important;
}



span.seulement,
span.monthly {
    font-size: 18px;
    font-weight: bold;
    margin-right: 8px;
}


.main-buttonwsigabs {
    background-color: #024772 !important;
    color: #fff;
    padding: 1.25rem;
    font-size: 1.25rem;
    width: 100%;
    display: flex;
}
.main-buttonwsigabs:hover {
    background-color: #024772 !important;
    color: #fff;
}



.main-button {
    background-color: #000;
    color: #fff;
    padding: 1.25rem;
    font-size: 1.25rem;
    width: 100%;
    display: flex;
}

article.formule li:last-child {
    border-bottom: 0px;
}

.main-button i {
    padding-right: 10px;
    transition: all ease 0.3s;
}

.intro-projets {
    max-width: 930px;
    margin-bottom: 3rem;
}

.main-button:hover {
    background-color: #000;
    color: #fff;
}

.main-button:hover i {
    padding-right: 30px;
}

.formule .main-button {
    padding: 0.8rem;
    text-align: center;
    justify-content: center;
    margin-top: 1.5rem;
    font-size: 1rem;
    background-color: #ffd400;
    color: #000;
}

#abonnement-tarifs h2 {
    padding: 30px 0px 45px 0px;
}

.single-post div#pastille {
    left: 0px;
}

/************************************************************
	Bubble home
************************************************************/
#section-emotion a:hover .bubble:nth-child(1) {
    animation-name: booooing1;
    animation-duration: 0.6s;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 0s;
}

#section-emotion a {
    position: relative;
}

#section-emotion a:hover .bubble:nth-child(2) {
    animation-name: booooing2;
    animation-duration: 0.6s;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 0.3s;
    bottom: initial;
}

a#button-print .speak {
    position: absolute;
    top: -80px;
    width: 600px;
    left: -90px;
}

a#button-web .speak {
    position: absolute;
    top: -80px;
    width: 600px;
    right: -230px;
}

/************************************************************
	FORMULAIRE DEMANDE DE DEVIS
************************************************************/

.wpcf7-form .wpcf7-checkbox label {
    cursor: pointer;
}

.wpcf7-form [type="radio"],
.wpcf7-form [type="checkbox"] {
    position: absolute;
    left: -9999px;
}

.wpcf7-form [type="radio"]+.wpcf7-list-item-label,
.wpcf7-form [type="checkbox"]+.wpcf7-list-item-label {
    position: relative;
    padding-left: 23px;
    line-height: 15px;
}

.custom-label {
    margin-bottom: 0.4rem;
    display: block;
}

.wpcf7-form [type="radio"]+.wpcf7-list-item-label::before,
.wpcf7-form [type="checkbox"]+.wpcf7-list-item-label::before,
.wpcf7-form [type="radio"]+.wpcf7-list-item-label::after,
.wpcf7-form [type="checkbox"]+.wpcf7-list-item-label::after {
    content: "";
    position: absolute;
    box-sizing: border-box;
}

.wpcf7-form [type="radio"]+.wpcf7-list-item-label::before,
.wpcf7-form [type="radio"]+.wpcf7-list-item-label::after {
    border-radius: 50%;
}

.wpcf7-form [type="radio"]+.wpcf7-list-item-label::before,
.wpcf7-form [type="checkbox"]+.wpcf7-list-item-label::before {
    top: 0;
    left: 0;
    width: 17px;
    height: 17px;
    border-radius: 100%;
    border: 1px solid #707070;
}

.wpcf7-form [type="radio"]:checked+.wpcf7-list-item-label::before,
.wpcf7-form [type="checkbox"]:checked+.wpcf7-list-item-label::before {
    border: 1px solid #2f2f2f;
}


.wpcf7-form [type="radio"]+.wpcf7-list-item-label::after,
.wpcf7-form [type="checkbox"]+.wpcf7-list-item-label::after {
    top: 4px;
    left: 4px;
    width: 9px;
    height: 9px;
    border-radius: 100%;
    background: #FFE900;
    transition: all 0.2s;
}

.wpcf7-form [type="radio"]:not(:checked)+.wpcf7-list-item-label::after,
.wpcf7-form [type="checkbox"]:not(:checked)+.wpcf7-list-item-label::after {
    opacity: 0;
    transform: scale(0.01);
}

.wpcf7-form [type="radio"]:checked+.wpcf7-list-item-label::after,
.wpcf7-form [type="checkbox"]:checked+.wpcf7-list-item-label::after {
    opacity: 1;
    transform: scale(1);
}

.wpcf7-checkbox {
    display: flex;
    flex-wrap: wrap;
}



.page-template-page-devis {
    background-color: #eee;
}

.mb-0 {
    margin-bottom: 0px !important;
}

.mb-1 {
    margin-bottom: 0.5rem !important;
}

.mb-2 {
    margin-bottom: 0.7rem;
}
.mb-3 {
    margin-bottom: 1rem;
}
.mb-4 {
    margin-bottom: 1.25rem;
}
.mb-5 {
    margin-bottom: 1.5rem;
}
.mb-6 {
    margin-bottom: 1.75rem;
}
.mb-7 {
    margin-bottom: 2rem;
}
.mt-5 {
    margin-top: 1.5rem;
}
.py-2 {padding-top:.5rem;padding-bottom:.5rem;}
.py-3 {padding-top:.75rem;padding-bottom:.75rem;}
.py-4 {padding-top:1rem;padding-bottom:1rem;}
.py-5 {padding-top:1.25rem;padding-bottom:1.25rem;}
.py-6 {padding-top:1.5rem;padding-bottom:1.5rem;}
.category.subtitle-upper {
    color: #B1B1B1;
    margin-bottom: 0rem;
}
.title-price {
    display: inline-block;
    border-bottom: 1px solid #a1a1a1;
}
.data {
    font-weight: 600;
    font-size: 1rem;
}

button {
    cursor: pointer;
}

.bouton-utilitaire.back {
    cursor: pointer;
}

.bouton-utilitaire.back:hover i.round {
    background-color: #393939;
}

.item-projet {
    margin-bottom: 3rem;
}

.item-projet a {
    color: #000;
}

.item-projet a:hover {
    color: #FF13A4;
}

.item-projet video {
    width: 100%;
}

.subtitle-upper,
.custom-label {
    text-transform: uppercase;
    font-weight: 600;
    font-size: .8rem;
}

.video-container {
    height: 100%;
    display: flex;
    align-items: center;
}

.video-single {
    width: auto;
    max-width: 100%;
}

#listing-projets-home h2,
#listing-projets h2,
#listing-projets-abt h2 {
    margin-bottom: 3rem;
}
.w-100 {
    width: 100%;
}
.space-top-2 {
    padding-top: 3rem;
}
.space-bottom-2 {
    padding-bottom: 3rem;
}

.single #listing-projets h2,
#listing-projets-abt h2 {
    margin-bottom: 1rem;
}

.space-section {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.space-section-lg {
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.space-section-xl {
    padding-top: 8rem;
    padding-bottom: 8rem;
}

#portfolio-2 .titre-1 {
    font-size: 38px;
}

#portfolio-2 .space-section {
    border-bottom: 1px solid #e9e9e9;
    padding-top: 6rem;
    padding-bottom: 6rem;
}

#portfolio-2 .cell.shrink {
    display: flex;
    align-items: center;
}

.item-projet a {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.keypoint svg {
    max-width: 65px;
}

.item-projet picture {
    flex-grow: 2;
    display: flex;
    align-items: end;
}

.item-projet p.category {
    margin-top: 0.5rem;
}

.item-projet img {
    object-fit: contain;
    object-position: center center;
    flex-grow: 2;
    flex-basis: 100%;
    margin-top: auto;
    max-height: 240px;
}

#portfolio-2 a.button-standard {
    text-transform: uppercase;
}

#devis {
    position: fixed;
    right: 85px;
    top: 0px;
    z-index: 10001;
    width: 100%;
    max-width: 400px;
    background-color: #fff;
    height: 100%;
    overflow: scroll;
    display: none;
}

#devis header {
    height: 84px;
    display: flex;
    flex-direction: revert;
    align-items: center;
}

#devis header .titre-2 {
    margin-right: auto;
}

#devis header,
#devis section {
    padding: 2rem 3rem;
}

.devis-section {
    border-bottom: 1px solid #c6c6c6;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    position: relative;
}

.border-none {
    border: 0 !important;
}

.devis-section.border-none {
    padding-bottom: 0px;
    margin-bottom: 0.75rem;
}

span.wpcf7-list-item {
    margin: 0.15rem 0rem;
    width: 100%;
}

.input-text {
    border-radius: 20rem;
    border: 1px solid #707070;
    padding: 0.7rem 1.5rem;
    width: 100%;
}

.wpcf7-textarea {
    border-radius: 1rem;
    border: 1px solid #707070;
    padding: 0.7rem 1.5rem;
    width: 100%;
    height: 120px;
}

input.wpcf7-form-control.wpcf7-submit {
    width: 100%;
    background: #000;
    border: 0px;
    color: #fff;
    padding: 1rem 2rem;
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
}

span.uacf7-amount {
    width: 100%;
    float: none;
}

.fourchette-budget-value:after {
    content: " CHF / €";
}

.fourchette-budget-value {
    position: absolute;
    top: 1px;
    right: 0px;
    font-size: .75rem;
}

input[type=range] {
    background-color: #ffffff !important;
    border: 1px solid #707070;
}

.wpcf7-form label.error {
    position: relative;
    top: -15px;
    left: 17px;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.sent .wpcf7-response-output {
    background-color: #EF3434 !important;
    border: 0px;
    color: #fff;
    font-weight: 600;
    padding: 1rem 2rem;
    font-size: .8rem;
    margin: 0px;
}

.wpcf7 form.sent .wpcf7-response-output {
    background-color: #46b450 !important;
}

#close-devis svg {
    width: 15px;
}

#close-devis {
    cursor: pointer;
}

#fixed-actions {
    position: fixed;
    bottom: 0px;
    display: flex;
    right: 85px;
    z-index: 1000;
}

input.wpcf7-form-control.wpcf7-submit:hover {
    background-color: #FFE900;
    color: #000;
}

#devis-button,
#call-button {
    background-color: #FFE900;
    color: #000;
    font-size: 1rem;
    font-weight: 600;
    padding: 1.5rem 2rem;
    border-radius: 10rem;
    margin: 1.5rem 1.5rem 1.5rem 1rem;
    cursor: pointer;
}

a#call-button {
    margin-right: 0px;
    width: 64px;
    height: 64px;
    display: block;
    position: relative;
}

#call-button i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#devis-button:hover,
#call-button:hover {
    background-color: #000;
    color: #FFE900;
}

.single-projets .h1 {
    font-size: 41px;
    font-weight: 600;
    margin-bottom: 10px;
}

#wpadminbar.mobile {
    display: none !important;
    visibility: hidden !important;
}

html {
    margin-top: 0px !important;
}

.title-block a.cell.shrink {
    width: calc(100% - 135px);
}

.title-block a.small-button.cell.shrink {
    width: auto;
}

.title-block.grid-x {
    align-items: baseline;
}

.article-blog {
    transition: all ease-in-out .3s
}

.article-blog:hover~.article-blog {
    opacity: 0.3 !important
}

.article-list:hover .article-blog {
    opacity: .3
}

.article-list .article-blog:hover {
    opacity: 1 !important
}

#service-blog h2 {
    margin-bottom: 3rem;
}

#service-blog.service-blog-keypoint h2 {
    margin-bottom: 1em;
}

.keypoint-blog {
    margin-bottom: 5rem;
}

.article-blog:last-child hr {
    display: none;
}

.single-services article.formule {
    height: 100%;
}

.single-services article.formule {
    display: flex;
    flex-direction: column;
}

.single-services article.formule ul {
    margin-bottom: 1rem;
}

.manager {
    display: none;
}

.page-template-page-journal .manager,
.category.archive .manager,
.single-post .manager {
    display: block;
}

.vcard i {
    font-size: 1.3rem;
    position: relative;
    left: 2px;
}

section#section-emotion,
a#offre,
#section-services {
    overflow: hidden;
}

.padding section#section-keypoints {
    max-width: none;
}

.abt-step {
    max-width: 330px;
    margin: 0 auto;
}

.step-separator svg {
    margin-top: 150px;
}

.abt-step .button-standard.big {
    font-size: 14px;
    color: #0082FF !important;
}

.abt-step img {
    display: block;
    margin: 0 auto;
}

.section-prestation {
    position: relative;
}

.section-prestation img {
    position: relative;
}

.section-prestation #infos-text {
    max-width: 570px;
    font-size: 16px;
    font-weight: 400;
    margin-top: 1rem;
}

.section-prestation .button-standard {
    margin-right: 1rem;
}
.single .section-article {
    padding-top: 5vh;
    padding-bottom: 5vh;
    max-width: 100%;
}
.infos-text {
    max-width: 540px;
}
.infos-text h2 {
    font-weight: bold;
    font-size: 2rem;
    margin-bottom: 1.5rem;
    color: #000;
}
.infos-text p + h2 {
    margin-top: 4rem;
}
.infos-text h3 {
    font-size: 21px;
    font-weight: 600;
    margin-bottom: 0.8rem;
    margin-top: 1.8rem;
    color: #000;
}
.infos-text {
    max-width: 540px;
    color: rgba(0, 0, 0, 0.67);
    font-size: 1rem;
}
.sticky-zone {position: sticky; top: 0px;}
.single .section-article .grid-x, .single .section-article .padding {
    width: 100%;
}
.infos-text.full-size {
    margin: 0 auto;
    max-width: 840px;
}
.single .section-article.bg-grey {
    padding-top: 10vh;
    padding-bottom: 10vh;
}
.single .section-article img {
    margin: auto;
    display: block;
}
.double-column-full {
    padding: 0px!important;
}
.image-col .sticky-zone {
    height: 100%;
    max-height: 100vh;
}
.sticky-zone img {
    height: 100%;
    object-fit: cover;
    object-position: center center;
}
.text-col {
    padding: 11vh 7vw;
}
hr.space {
    border: 0px;
    margin: 3rem 0 0 0;
}
#nav-right-bloc .cell {
    border-right: 1px solid #cacaca;
}
#nav-right-bloc .cell:last-child {
    border-right: 0px solid #cacaca;
}
.size-xl a, .infos-text a, .size-md a, .conclusion-text a {
    color: initial;
    text-decoration: underline;
}
#swissflag {
    background-color: #fff;
}
.wpcf7-acceptance {
    font-size: .7rem;
}
.cky-box-bottom-left {
    bottom: 30px!important;
    left: 100px!important;
}
.cky-notice-des *, .cky-preference-content-wrapper *, .cky-accordion-header-des *, .cky-gpc-wrapper .cky-gpc-desc *, .cky-notice-des a.cky-policy, .cky-notice-des button.cky-policy {
    font-size: 10px!important;
}
body .cky-btn-revisit-wrapper {
    background: #000!important;
    width: 30px;
    height: 30px;
}
body .cky-revisit-bottom-left {
    bottom: 40px;
    left: 27px;
}
body .cky-btn-revisit-wrapper .cky-btn-revisit img {
    max-width: fit-content;
    margin: 0;
    height: 20px;
    width: 20px;
}
.postid-2154 h1.display-3 {
    max-width: 600px;
}
.postid-2154 .section-article .bg-blue {
    background-color: #ececec!important;
}
.postid-2154 .section-article. {
    min-height: 80vh;
}
.home-2 #accueil-main:before {
    content: "";
}
.position-relative {position: relative;}
.home-2 #accueil-main:before {
    content: "";
    display: block;
    position: absolute;
    height: 100%;
    width: 40%;
    background-color: #fff066;
    right: 0px;
    top: 0px;
    z-index: 100;
}
.button-rounded {
    color: #000;
    border: 1px solid #000;
    padding: 13px 30px;
    border-radius: 99rem;
    font-weight: 600;
    display: flex;
    align-items: center;
}
.button-rounded i {
    margin-left: 10px;
}
.button-rounded:hover {
    background-color: #FF13A4;
    border-color: #FF13A4;
    color: #fff;
}
.item-projet.v2 {
    background-color: #fff;
    border-radius: 15px;
    overflow: hidden;
}
.item-projet.v2 video {
    object-fit: cover;
    height: 100%;
}
.title-zone {
    padding: 30px 40px;
}
.mt-0 {margin-top: 0px!important;}
.item-projet.v2 img {
    object-fit: cover;
    width: 100%;
    height: auto;
    max-height: initial;
}
.item-projet.v2 img, .item-projet.v2 video {
    object-fit: cover;
    width: 100%;
    height: 360px;
    min-height: initial;
    max-height: initial;
    flex-basis: auto;
    margin: 0px;
}
.item-projet.v2 .video-container {
    height: 360px;
}
.item-projet.v2 picture {
    align-items: start;
}
.background-image {
    position: absolute;
    left: 0px;
    top: 0px;
    bottom: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}
.item {
    background-color: white;
    border-radius: 15px;
    padding: 50px 50px;
    display: flex; flex-direction: column; align-items: start;
    overflow: hidden;
}
.text-uppercase {text-transform: uppercase;}
.font-color-white-55 {
    color: rgba(255, 255, 255, 0.55);
}
.font-color-black-55 {
    color: rgba(0, 0, 0, 0.55);
}
.font-color-black {
    color: rgb(0, 0, 0)!important;
}
.font-color-white {
    color: #ffffff;
}
.font-color-green{color: #0c9b18 !important;}
.font-color-orange{color: #f8761a !important;}

.item-projet.v2 picture {
    flex-grow: initial;
}
.cta {cursor: pointer;}
.cta .img-cta {
    transition: all ease-in-out .4s;
    transform: scale(1);
}
.cta:hover .img-cta {
    transform: scale(1.05);
}
.cta i {
    border: 1px solid #fff;
    color: #fff;
    padding: 10px;
    border-radius: 100%;
    font-size: 1.5rem;
    opacity: 0.5;
    transition: all ease-in-out .3s;
    position: absolute;
    width: 46px;
    height: 46px;
    display: flex!important;
    align-items: center;
    justify-content: center;
    bottom: 20px;
    right: 37px;
}
.cta:hover i {
    opacity: 1;
    transform: rotate(540deg);
}
.cta:before {
    content: "";
    display: block;
    width: 100%;
    height: 300px;
    max-height: 50%;
    position: absolute;
    top: 0px;
    left: 0px;
    background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.35) 100%);
    z-index: 200;
}
.home .title-1, .page-template-page-accueil-new .title-1 {
    font-size: 45px;
}
hr.cell.small-12 {
    display: block;
    max-width: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.13);
}
.color-inherit {
    color: inherit;
}
.item-blog img, .item-blog .default-img {
    height: 230px!important;
    background-color: #282729;
}
.default-img {
    display: flex;
    align-items: center;
    justify-content: center;
}
.default-img svg {
    transform: rotate(0deg);
    transition: all ease-in-out 1s;
}
.item-blog:hover .default-img svg {
    transform: rotate(360deg);
    transition: all ease-in-out 1s;
}
.bg-white {background-color:white}
.conclusion-title *:last-child {
    margin-bottom: 0px;
}
.conclusion-title {
    padding: 50px 50px 50px 50px;
    -webkit-border-top-right-radius: 14px;
    -webkit-border-bottom-right-radius: 14px;
    -moz-border-radius-topright: 14px;
    -moz-border-radius-bottomright: 14px;
    border-top-right-radius: 14px;
    border-bottom-right-radius: 14px;
}
.conclusion-text {
    width: 90%;
    max-width: 630px;
    padding-left: 5%;
    padding-top: 50px;
}
#main-footer {
    background-color: rgba(0, 0, 0, 0.9);
    margin: 0px 85px;
}
hr.cell.small-12.white {
    border-bottom: 1px solid rgb(255 255 255 / 13%);
}
.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
}
.footer-contact, .footer-contact span {
    display: flex;
    align-items: center;
    padding: 4px 0px;
}
.footer-contact svg {
    margin-right: 16px;
}
.footer-menu li a {
    color: #fff;
    font-size: 12px;
    padding: 9px 0px;
}
#footer-bar {
    background-color: #000;
}
#footer-bar {
    background-color: #000;
    display: flex;
    align-items: center;
    padding: 19px 0px;
}
#main-footer hr {
    margin: 3.25rem auto;
}
.item.cta {
    min-height: 50vh;
}
.conclusion-title {
    max-width: 90%;
}
.prices-titre-1 {
    font-size: clamp(.8rem, 1.2vw, 1.3rem);
}
.prices-titre-2 {
    font-size: clamp(2.8rem, 3.8vw, 4.4rem);
}
span.prices-titre-3 {
    font-size: clamp(.8rem, .9vw, 1.2rem);
}
article.formule ul.bg-icon-orange li svg {
    height: 24px;
    margin-right: 10px;
    min-width: 9px;
}
.prices-button {
    font-size: clamp(.8rem, .9vw, 1.2rem);
    text-align: center;
    align-items: center;
    justify-content: center;
    padding: 1vw 30px;
    line-height: 1;
}
#tarifs  tbody, #tarifs tfoot, #tarifs thead {
    background: transparent;
}
#tarifs thead th {
    padding: 30px;
    font-size: clamp(1rem, 1.2vw, 1.3rem);
    text-align: center;
    font-weight: 600;
}
#tarifs td:nth-child(even), #tarifs th:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.35);
}
#tarifs td:hover {
    background-color: inherit;
}
#tarifs.hover tbody tr:hover {
    background-color: #ffffff40!important;
}
#tarifs td {
    color: #000;
    font-weight: 600;
    padding: 24px 17px;
    border-left: 0px;
    border-right: 0px;
    text-align: center;
    max-width: 25%;
    width: 100%;
}
#tarifs td:first-child {
    color: rgba(0, 0, 0, 0.55);
    font-weight: 400;
}
#tarifs tbody tr:first-child td {
    border-top: solid 1px #e4e4e4;
}
#abonnement-tarifs + hr.space {
    display: none;
}
.keypoint {
    background-color: white;
    border-radius: 14px;
    margin-bottom: 2rem;
    position: relative;
    padding: 2rem 3rem 2rem 3rem;
    }
.page-template-page-journal .section .button-rounded {
    display: none;
}
.chapter-title {
    display: flex;
    align-items: center;
}
.chapter-title img {
    max-width: 130px;
}
.chapter-title .title {
    margin-left: 20px;
    border-bottom: 1px solid #b3b3b3;
    font-weight: 600;
    display: inline-block;
    width: 100%;
}
/************************************************************
	MEDIAS QUERIES
************************************************************/
.show-for-mobile {
    display: none;
}
@media(min-width:781px) {
    .font-size-md-1{font-size:.6rem!important}
    .font-size-md-2{font-size:.7rem!important}
    .font-size-md-3{font-size:.9rem!important}
    .font-size-md-3-5{font-size:1rem!important}
    .font-size-md-4{font-size:1.15rem!important}
    .font-size-md-5{font-size:1.3rem!important}
    .font-size-md-6{font-size:1.45rem!important}
    .font-size-md-7{font-size:1.6rem!important}
    .font-size-md-7-5{font-size:1.9rem!important}
    .font-size-md-8{font-size:2.2rem!important}
    .font-size-md-9{font-size:2.75rem!important}
    .font-size-md-10{font-size:3rem!important}
    .font-size-md-11{font-size:3.75rem!important}
    .font-size-md-12{font-size:4.4rem!important}
    .font-size-md-13{font-size:5rem!important}
    .font-size-md-14{font-size:6rem!important}
#section-emotion a.default-actived .bubble:nth-child(1) {
    animation-name: booooing1;
    animation-duration: 0.6s;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 0s;
}

#section-emotion a.default-actived .bubble:nth-child(2) {
    animation-name: booooing2;
    animation-duration: 0.6s;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 0.3s;
    bottom: initial;
}
}
@media(min-width:1200px) {
    .grid-container {
        max-width: 100%;
        width: 100%;
    }
    .font-size-xl-1{font-size:.6rem!important}
    .font-size-xl-2{font-size:.7rem!important}
    .font-size-xl-3{font-size:.9rem!important}
    .font-size-xl-3-5{font-size:1rem!important}
    .font-size-xl-4{font-size:1.15rem!important}
    .font-size-xl-5{font-size:1.3rem!important}
    .font-size-xl-6{font-size:1.45rem!important}
    .font-size-xl-7{font-size:1.6rem!important}
    .font-size-xl-7-5{font-size:1.9rem!important}
    .font-size-xl-8{font-size:2.2rem!important}
    .font-size-xl-9{font-size:2.75rem!important}
    .font-size-xl-10{font-size:3rem!important}
    .font-size-xl-11{font-size:3.75rem!important}
    .font-size-xl-13{font-size:5rem!important}
    .font-size-xl-14{font-size:6rem!important}

}

@media(min-width:1400px) {
    .grid-container {
        max-width: 1300px;
        width: 100%;
    }

    div#listing-services.grid-x>.large-4 {
        width: 33.33333%;
    }

    #pastille {
        left: 0px;
    }
}

@media(min-width:1300px) {
    .single a#offre {
        margin-left: 0%;
        width: 100%;
    }
}

@media(max-width:1400px) {

    .cell.fullheight.service {
        min-height: 50vh;
        padding-top: 0% !important;
        padding-top: 0px;
        padding-top: 0%;
    }

    #offre {
        min-height: 730px;
    }

    span#votre-site {
        font-size: 60px;
    }

    span#seulement,
    span#monthly {
        font-size: 24px;
    }

    span#montant {
        font-size: 210px;
    }

    span#devise {
        top: 40px;
        right: -66px;
        font-size: 22px;
    }

    #offre h1#title,
    #offre #title-container {
        max-width: 670px;
    }

    img#main-image {
        max-width: 830px;
        top: 170px;
        left: 50%;
    }

    #pastille {
        background-color: #ffd400;
        width: 220px;
        height: 220px;
        font-size: 1.5rem;
        top: 130px;
        left: 10px;
    }

    #offre.include img#main-image {
        transform: translateX(-85%);
    }

    div#listing-services.grid-x>.large-4 {
        width: 50%;
        padding-top: 50%;
    }

    .postid-83 p.display-3 {
        font-size: 55px;
    }


    .display-3 {
        font-size: 65px;
    }

    .wordtitle span:last-child {
        font-size: 80px;
        bottom: 15px;
    }

    .wordtitle {
        font-size: 21px;
    }

    .title-1 {
        font-size: 48px;
        line-height: 1.3;
    }

    section#section-contact .wordtitle span:last-child {
        font-size: 65px;
        bottom: 5px;
    }

    #color-round-service-CTA span {
        font-size: 45px;
    }

    #com-passion {
        right: -6%;
    }

    #com-out-box {
        bottom: 4%;
        right: 30%;
    }

    #com-fun {
        top: 6%;
        right: 22%;
        z-index: 700;
    }

    .tooltip.bg-yellow {
        min-width: 410px;
    }

    .single-services .display-3,
    #section-presentation .display-3 {
        font-size: 50px;
    }

    .step-separator {
        display: none;
    }

    .abt-step {
        max-width: 260px;
    }
}

@media(max-width:1200px) {

    .single-services .display-3,
    #section-presentation .display-3 {
        font-size: 40px;
    }

    .single-services .display-3 br,
    #section-presentation .display-3 br {
        display: none;
    }

    section#section-documentation.sitemap .grid-container .cell {
        margin-top: 30px;
        margin-bottom: 30px;
        position: relative;
    }

    .postid-83 p.display-3 {
        font-size: 45px;
    }

    section#section-contact .wordtitle span:last-child {
        font-size: 50px;
        bottom: -5px;
    }

    #color-round-service-CTA span {
        font-size: 40px;
    }

    .h1 {
        font-size: 45px;
        margin-bottom: 25px;
    }

    #journal-single #main-icon i {
        font-size: 200px;
    }

    #com-fun {
        top: 3%;
        right: 12%;
        z-index: 700;
    }

    #com-out-box {
        bottom: 0%;
        right: 30%;
    }

    #com-prestige {
        top: 0%;
        left: 0%;
    }

    div#box-title {
        max-width: 495px;
        margin-top: 8%;
    }

    section#accueil-main .cell.small-12.large-4,
    section#accueil-main .cell.small-12.large-8 {
        width: 100%;
    }

    #image-main img,
    .image-main img {
        max-height: initial;
        max-width: 100%;
    }

    #pastille {
        width: 210px;
        height: 210px;
        font-size: 1.4rem;
    }

    #section-emotion .bubble {
        font-size: 20px !important;
    }

    #section-emotion .bubble:nth-child(2) {
        left: 215px;
    }

    a#button-web .speak {
        top: -64px;
        width: 420px;
        right: -140px;
    }

    a#button-print .speak {
        top: -64px;
        width: 400px;
    }
}

@media(min-width:1025px) {
    #journal-single .bubble.single-title {
        transform: scale(1) rotate(-5deg);
        top: -120px;
        left: 140px;
        font-size: 24px;
        animation-name: booooing2;
        animation-duration: 0.6s;
        /* or: Xms */
        animation-direction: alternate;
        /* or: normal */
        animation-timing-function: ease-in-out;
        /* or: ease, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) */
        animation-fill-mode: forwards;
        /* or: backwards, both, none */
        animation-delay: 0s;
        /* or: Xms */
    }

    .page-template-page-forfait-abt #section-presentation img#presentation-image {
        position: absolute;
        right: 50%;
        top: 50%;
        transform: translate(0%, -50%);
        width: 80%;
        max-width: 1000px;
    }
}

@media(max-width:1024px) {
    .flex-reverse-for-md {
        flex-direction: column-reverse;
    }
    .mb-md-0 {
        margin-bottom: 0px !important;
    }
    
    .mb-md-1 {
        margin-bottom: 0.5rem !important;
    }
    
    .mb-md-2 {
        margin-bottom: 0.7rem !important;
    }
    .mb-md-3 {
        margin-bottom: 1rem !important;
    }
    .mb-md-4 {
        margin-bottom: 1.25rem !important;
    }
    .mb-md-5 {
        margin-bottom: 1.5rem !important;
    }
    .mb-md-6 {
        margin-bottom: 1.75rem !important;
    }
    .mb-md-7 {
        margin-bottom: 2rem !important;
    }
    .home-2 #accueil-main:before {
        height: 40vw;
        width: 100%;
    }
    #nav-right-bloc .cell {
        border-right: 0px;
        border-bottom: 1px solid #cacaca;
    }
    #navigation.show {
        padding-right: 69px;
    }
    #listing-projets-home h2 {
        margin-bottom: 1rem !important;
    }

    #listing-projets-home {
        padding-bottom: 1rem;
    }

    .section-prestation.right .grid-x {
        flex-direction: column-reverse;
    }

    .abt-step {
        margin-bottom: 3rem;
    }

    .service.medium-4 {
        padding-top: 33.333%;
    }

    .service.medium-6 {
        padding-top: 50%;
    }

    #offre #title-container {
        padding-right: 30px;
    }

    #color-round-service-CTA {
        width: 50vw;
        height: 50vw;
        margin-bottom: 3rem;
    }

    #offre {
        min-height: 640px;
    }

    .keypoint:nth-child(3)::before {
        content: "";
        width: 50%;
        height: 1px;
        background-color: rgba(0, 0, 0, 0.14);
        display: block;
        position: absolute;
        left: 0px;
        top: 0px;
        transform: translateX(50%);
    }

    .keypoint:nth-child(3)::after {
        display: block;
    }

    .keypoint:nth-child(2)::after,
    .keypoint:nth-child(4)::after,
    .keypoint:nth-child(6)::after {
        display: none;
    }

    #pastille {
        width: 180px;
        height: 180px;
        font-size: 1.2rem;
        top: 50px;
    }

    span#votre-site {
        font-size: 43px;
    }

    span#seulement,
    span#monthly {
        font-size: 20px;
    }

    img#main-image {
        max-width: 690px;
        top: 170px;
        left: 50%;
    }

    img#main-image {
        max-width: 690px;
        top: 170px;
        left: 5%;
    }

    span#montant {
        font-size: 170px;
    }

    #abonnement-tarifs h2 {
        padding: 0px 0px 0px 0px;
    }

    #pastille {
        position: relative;
        left: 0px;
    }

    section#section-call-action {
        flex-direction: column;
    }

    #infos-cta {
        top: 0px;
        margin-top: 30px;
    }

    section#section-emotion-projet img {
        position: relative;
        top: initial;
        left: initial;
        width: 80%;
    }

    section#section-emotion-projet {
        min-height: 100vh;
        margin-bottom: 10vh;
    }

    section#section-emotion-projet .wordtitle {
        margin-top: 8vh;
    }

    svg#long-arrow {
        display: none;
    }

    .round-image {
        padding-top: calc(100% - 1.875rem);
        margin-bottom: 30px;
    }

    #section-round-image .h1 {
        margin-left: 0px;
    }

    section#section-presentation img#presentation-image {
        position: relative;
        transform: initial;
    }

    #color-round-presentation {
        width: 70vw;
        height: 70vw;
        left: calc(100% - 84px);
        left: 50%;
    }

    #container-prestation .section-prestation {
        padding: 78px 100px;
    }

    .color-round-presentation {
        width: 60vw;
        height: 60vw;
        left: calc(100% - 84px);
        left: 50%;
    }

    #color-round-presentation {
        width: 70vw;
        height: 70vw;
        left: calc(100% - 84px);
        left: 50%;
    }

    .section-prestation.right .color-round-presentation {
        left: 50%;
        transform: translate(-50%, 0%);
    }

    section#section-presentation {
        overflow: hidden;
        position: relative;
    }

    section#section-documentation .grid-container .cell {
        margin-top: 30px;
        margin-bottom: 30px;
        position: relative;
    }

    #section-documentation .speak,
    section#section-documentation .cell:nth-child(3) .speak {
        right: initial;
        left: 100px;
        top: -100px;
    }

    section#section-emotion img {
        width: 50%;
    }

    div#infos-text {
        align-self: flex-start;
    }

    div#infos-presentation p.display-3 {
        max-width: 660px;
    }

    #face {
        display: none;
    }

    #journal-parent .bubble:nth-child(1) {
        top: -135px;
        left: 30%;
    }

    #journal-parent .bubble:nth-child(2) {
        top: -90px;
        left: 50%;
    }

    #blog-nav {
        position: relative;
        flex-direction: row;
        justify-content: center;
        border-radius: 0;
        width: min-content;
        margin: 0px auto;
        -webkit-border-bottom-right-radius: 50px;
        -webkit-border-bottom-left-radius: 50px;
        -moz-border-radius-bottomright: 50px;
        -moz-border-radius-bottomleft: 50px;
        border-bottom-right-radius: 50px;
        border-bottom-left-radius: 50px;
        padding: 0px 10px;
        top: 0px;
        transform: initial;
    }

    div#journal-parent,
    #journal-single {
        margin-top: 230px;
        position: relative;
    }

    div#journal-list {
        margin-top: 30px;
    }

    svg#corner-top {
        position: absolute;
        top: 0px;
        left: -40px;
        width: 40px;
        transform: rotate(-0deg);
    }

    svg#corner-bottom {
        position: absolute;
        bottom: initial;
        top: 0px;
        right: -40px;
        width: 40px;
    }

    div#journal-single div#main-icon i {
        display: none;
    }

    div#journal-single div#main-icon h1.single-title {
        transform: initial;
        left: initial;
        top: initial;
        position: relative;
        margin-bottom: 50px;
        line-height: 1.3;
    }

    #journal-single {
        margin-top: 50px;
    }



    #offre.include img#main-image {
        transform: translateX(-26%);
    }
}

@media(max-width:959px) {
    .text-col.bg-grey {
        background-color: #fff;
    }
    .sm-reverse .grid-x {
        flex-direction: column-reverse;
    }
    .infos-text h2, .infos-text h3 {
        font-size: 1.5rem;
    }
    #listing-services {
        margin-right: 0px;
    }

    #listing-services.grid-x>.small-12.medium-6 {
        padding-top: 100%;
    }

    #portfolio-2 .large-shrink {
        justify-content: flex-start;
        flex-direction: row;
    }

    div#page-offre #accueil-main .grid-x.padding {
        overflow: hidden;
    }

    div#page-offre #accueil-main #image-main img,
    div#page-offre #accueil-main .image-main img {
        position: relative;
        left: 15px;
    }

    div#page-offre #accueil-main #image-main,
    div#page-offre #accueil-main .image-main {
        overflow: visible;
    }

    #image-main,
    .image-main {
        left: 0px;
    }

    section#section-contact p.wordtitle {
        flex-direction: column;
        text-align: center;
    }

    section#section-contact span br {
        display: none;
    }

    section#section-contact .wordtitle span:last-child {
        margin-top: 10px;
    }

    div#listing-services.grid-x>.large-4 {
        width: 100%;
    }


    .wordtitle span:last-child {
        font-size: 60px;
        bottom: 13px;
        margin-left: 9px;
    }

    p.wordtitle {
        font-size: 15px;
    }

    .padding {
        padding-left: 10px;
        padding-right: 10px;
    }

    section#section-emotion img {
        width: 60%;
    }
    ul#main_menu_top {
        padding: 18px;
        justify-content: center;
    }
    .title-1 {
        font-size: 38px;
    }

    div#box-title {
        margin-left: 0px;
    }

    .display-4 {
        font-size: 95px;
    }

    .infos-service {
        margin: auto;
        left: 0px;
    }

    #navigation {
        flex-direction: column;
    }

    #nav-right-bloc > div:nth-child(1) {
        border-top: 1px solid #cccccc;
    }

    #color-round {
        width: 80vw;
        height: 80vw;
    }

    .section.full {
        padding: 50px 0px;
    }

    section#corporate-identity {
        padding: 50px 15px;
    }

    section#interactiv-map {
        padding: 50px 15px;
    }

    #color-round-service-CTA span {
        font-size: 40px;
    }

    #navigation {
        display: inline-block;
    }

    #icon-category {
        transform: scale(0.9);
    }

    section#section-client table tbody td {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        border: solid 0px #fff;
        border-bottom: solid 1px #e4e4e4 !important;
        line-height: 8;
        height: 140px;
        text-align: center;
    }

    section#section-client table tbody td img {
        margin: 0 auto;
        display: inline;
        vertical-align: middle;
        text-align: center;
        min-width: 170px;
    }

    span.number404 {
        font-size: 160px;
    }

    div#visuel404 img {
        width: 130px;
    }

    .section-services {
        flex-direction: column-reverse;
    }

    img.img-service {
        width: 100% !important;
        margin: 40px auto 0 auto !important;
    }

    .section-services p.display-4 {
        position: relative;
        left: 0;
    }

    #section-emotion .bubble:nth-child(2) {
        left: 165px;
    }
}


@media(max-width:780px) {
    .wordtitle br {
        display: none;
    }

    img#main-image {
        max-width: 490px;
        top: 170px;
        left: 0%;
    }

    #offre {
        min-height: 530px;
    }

    #offre h1#title,
    #offre #title-container {
        max-width: 450px;
    }

    #pastille {
        width: 160px;
        height: 160px;
        font-size: 1.1rem;
        top: 50px;
        left: -20px;
    }

    section#section-emotion img {
        width: 70%;
    }

    p.wordtitle {
        flex-direction: column;
        text-align: left;
    }

    .wordtitle span:last-child {
        font-size: 60px;
        bottom: 0;
        margin-left: 0px;
        margin-top: 10px;
    }

    p.wordtitle {
        text-align: center;
        font-size: 20px;
        margin-top: 30px;
    }

    div#list .tooltip-html.i {
        width: calc(100% - 1.875rem);
    }

    #icon-category {
        transform: scale(0.8);
    }

    section#section-contact .wordtitle span:last-child {
        font-size: 40px;
    }

    img#ask-dimi {
        display: none;
    }

    #pastille {
        width: 180px;
        height: 180px;
        font-size: 1.2rem;
        top: 80px;
    }
}

@media(max-width:639px) {   
    .item-projet.v2 img, .item-projet.v2 video, .item-projet.v2 .video-container {
        height: auto;
    }
    section#section-emotion {
        min-height: initial;
        padding: 94px 0px;
    }
    body .cky-revisit-bottom-left {
        display: none;
    }
    header#main-menu {
        position: fixed;
        background: transparent;
    }
    #main-footer {
        margin: 0px;
    }
    #container-prestation .section-prestation {
        padding: 78px 15px;
        width: 100%;
    }

    #container-prestation {
        margin-left: 0px;
        width: 100%;
        padding: 0px;
    }

    .service.small-12 {
        padding-top: 100% !important;
    }

    section#section-call-action {
        padding: 0vh 0 6rem 0;
    }

    #infos-cta {
        top: 20px;
    }

    #section-presentation {
        display: flex;
        align-items: flex-start;
    }

    .section.full {
        min-height: auto;
    }

    #section-presentation,
    #infos-cta,
    section#portfolio-cta-image .single-cta>div {
        padding-left: 10px;
        padding-right: 10px;
    }

    .space-section-xl {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .keypoint:nth-child(4)::before,
    .keypoint:nth-child(5)::before,
    .keypoint:nth-child(6)::before,
    .keypoint:nth-child(7)::before,
    .keypoint:nth-child(8)::before,
    .keypoint:nth-child(9)::before,
    .keypoint:nth-child(3)::before,
    .keypoint:nth-child(2)::before {
        content: "";
        width: 50%;
        height: 1px;
        background-color: rgba(0, 0, 0, 0.14);
        display: block;
        position: absolute;
        left: 0px;
        top: 0px;
        transform: translateX(50%);
    }

    .keypoint:after {
        display: none !important;
    }

    a.link.sitemap,
    #swissflag {
        display: none;
    }

    section#section-contact p.wordtitle {
        font-size: 20px;
    }

    section#section-contact .wordtitle span:last-child {
        font-size: 43px;
        margin-top: 20px;
    }

    div#title-section .small-caps.black {
        margin: 0px;
    }

    div#title-section {
        padding: 0px 20px;
    }

    .display-4 {
        font-size: 75px;
    }

    #section-services-marketing .display-4,
    #section-services-animation .display-4 {
        font-size: 60px;
    }

    .menu-item a {
        font-size: 30px;
    }

    .tax-type_services main#content {
        margin: 0px;
    }

    header#main-menu {
        min-height: initial;
        width: auto;
        border: 0px;
        flex-direction: row;
    }

    header#main-menu .small-caps {
        transform: none;
        min-width: initial;
        transform-origin: center center;
    }

    #burger-container {
        width: 84px;
        order: 2;
    }

    div#title-section {
        order: 1;
        border-bottom: 1px solid #cccccc;
    }

    header#main-menu .small-caps {
        width: auto;
    }

    #navigation {
        margin-top: 84px;
        padding-bottom: 84px;
        border-right: 1px solid #cccccc;
    }

    a#mobile-version-logo {
        width: 84px;
        position: fixed;
        right: -84px;
        z-index: 1200;
    }

    .show-for-mobile {
        display: block;
    }

    a#mobile-version-logo {
        right: -84px;
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%);
        -webkit-transition: all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
        -moz-transition: all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
        -o-transition: all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
        transition: all 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
        top: 84px;
    }

    a#mobile-version-logo.show {
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        -o-transform: translateX(0px);
        transform: translateX(0px);
        right: 0px;
    }

    div#left-head {
        display: none;
    }

    #big-contact {
        display: none;
    }

    ul#second-menu.show-for-mobile {
        display: flex;
        padding: 0px 0px;
    }

    ul#second-menu.show-for-mobile li {
        padding: 7px 20px;
    }

    #section-documentation .speak {
        display: none;
    }

    #color-round {
        width: 100vw;
        height: 100vw;
    }

    main#content {
        margin: 0px 0px;
    }

    .single-services main#content {
        margin: 0px;
    }

    .single-services main#content .section {
        margin: 0px 0.9375rem;
        width: calc(100% - 1.875rem);
    }

    .single-services main#content #section-presentation {
        margin: 0px 0px;
        width: 100%;
    }

    .section.full:first-child {
        min-height: calc(100vh - 84px);
    }

    .size-xl {
        font-size: 16px;
    }

    .display-3 {
        font-size: 45px;
    }

    .single-services footer.footer {
        margin: 0px;
    }

    section#section-list-i h2 {
        font-size: 34px;
        margin-bottom: 25px;
    }

    #color-round-service-CTA {
        width: 80vw;
        height: 80vw;
    }

    #color-round-service-CTA span {
        font-size: 25px;
    }

    #infos-cta {
        top: 20px;
    }

    section#section-contact i.icon-im_contact {
        font-size: 350px;
    }

    section#section-contact p.wordtitle {
        margin-top: 40px;
    }

    section#section-emotion p.wordtitle {
        margin-top: 40px;
    }

    .bubble {
        font-size: 23px !important;
    }

    #section-tarifs .h1 {
        padding: 0px 15px;
    }

    /*#nav-right-bloc div:nth-child(2) {
        display: none;
    }*/

    .tooltip {
        font-size: 35px;
    }

    .tooltip.bg-yellow {
        min-width: 273px;
    }

    .tooltip.bg-pink {
        min-width: 310px;
    }

    #com-passion {
        right: -6%;
        top: initial;
        bottom: 15%;
    }

    #com-out-box {
        bottom: 0%;
        right: 50%;
    }

    .tooltip.bg-red {
        -webkit-transform: translate(-50%, -100%);
        transform: translate(-50%, -100%);
    }

    .tooltip.bg-yellow {
        transform: translate(-80%, 2%);
    }

    #com-fun {
        top: 13%;
        right: 18%;
        z-index: 700;
    }

    div#box-title {
        margin: 120px 0px;
    }

    section#section-emotion-projet img {
        transform: initial;
    }

    section#section-emotion-projet .wordtitle {
        transform: initial;
    }

    section#corporate-identity {
        overflow: hidden;
    }

    /*.home section#portfolio-cta, .home #newsletter-form {
    width: calc(100% + 80px)!important;
    margin-left: -40px!important;
    margin-right: -40px!important;
}*/
    section#accueil-main .grid-x,
    #listing-projets-home {
        padding: 0px 15px;
    }

    #fixed-actions,
    #devis {
        right: 0px;
    }

    #abonnement-tarifs .title-1 {
        font-size: 30px;
        margin-bottom: 0px;
        margin-top: 2rem;
    }

    section#abonnement-tarifs {
        margin: 0px auto !important;
        width: 100% !important;
        padding: 0px !important;
    }

    #offre-faq {
        margin: 0px !important;
        width: 100% !important;
        padding: 4rem 15px !important;
    }

    .formule p.size-lg {
        margin: 0.5rem 0rem 1.5rem 0rem;
    }

    .abt-step {
        max-width: 330px;
    }
    .tarif-grid {
        padding-left: 37px;
    }
}

@media(max-width:500px) {
    .item {
        padding: 40px 30px;
    }
    #nav-right-bloc p.h2 a {
        padding: 7px 0px;
        display: block;
    }

    #nav-right-bloc p.h2 br {
        display: none;
    }

    #portfolio-2 .space-section {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    h2#title {
        align-items: center;
    }

    #pastille {
        left: 0px;
        top: 60px;
    }

    #offre.include img#main-image {
        transform: translateX(-61%);
        left: 50%;
        top: -40px;
    }

    img#main-image {
        position: relative;
        top: 0px;
        left: 0px;
        transform: translateX(-26%);
        width: 130%;
    }

    #offre button.button-standard.big {
        margin: 40px auto 0px auto;
    }

    span#votre-site {
        text-align: center;
        display: block;
    }

    #b-3 {
        flex-direction: column;
    }

    #offre h1#title,
    #offre #title-container {
        position: relative;
        left: 0px;
        transform: none;
        align-items: flex-start;
        max-width: 380px;
    }

    #offre {
        height: auto;
        overflow: hidden;
        min-height: initial;
    }

    .single-services .display-3,
    #section-presentation .display-3 {
        font-size: 30px;
    }

    .menu-item a {
        font-size: 19px;
        padding: 12px 13px;
    }

    #navigation .h2 {
        font-size: 15px;
    }
    #nav-right-bloc .grid-x > div {
        padding: 30px 14px;
    }

    #nav-right-bloc div:nth-child(2) {}

    ul#main_menu_top {
        padding: 30px;
    }

    .display-4 {
        font-size: 65px;
    }

    #section-services-marketing .display-4,
    #section-services-animation .display-4 {
        font-size: 50px;
    }

    .infos-service {
        padding: 0px 20px;
    }

    /*ul#smileys-communication {
    display: none;
}*/
    #passion.wordtitle span:last-child {
        font-size: 49px;
    }

    section#section-contact i.icon-im_contact {
        font-size: 280px;
    }

    .h1,
    .single-projets .h1,
    ul#blog-nav i,
    ul#blog-nav i.icon-explorateur span:before {
        font-size: 35px;
    }

    ul#blog-nav a {
        padding: 15px;
    }

    svg#corner-top {
        left: -29px;
        width: 30px;
    }

    svg#corner-bottom {
        right: -29px;
        width: 30px;
    }

    .bloc-info a.cell.shrink:not(.small-button) {
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        width: calc(100% - 1.875rem);
    }

    section#section-contact .wordtitle span:last-child {
        margin-top: 10px;
        font-size: 23px;
    }

    div#visuel404 img {
        width: 95px;
        bottom: 8px;
    }

    span.number404 {
        font-size: 110px;
    }

    .infos-service {
        margin-right: 0px;
        margin-left: 0px;
        left: 0px;
        padding: 0px 0px;
    }

    .inf-content input[type="text"] {
        font-size: 0.8rem;
        padding: 2rem 1rem;
    }

    .inf-submit input {
        padding: 26px 12px !important;
        font-size: 11px !important;
    }

    section#section-keypoints h2,
    #listing-projets-home h2,
    .titre-1,
    #listing-projets h2,
    #listing-projets-abt h2,
    #accueil-main .title-1 {
        font-size: 35px;
    }
    #section-tarifs section ul li {
        display: flex;
        flex-direction: column;
    }
}

@media(max-width:400px) {
    .keypoint-title {
    padding: 0rem 0rem;
}
    #section-tarifs .h1 {
        font-size: 25px;
    }
    #abonnement-tarifs .cell {
        padding-left: 0px;
        padding-right: 0px;
    }

    article.formule {
        padding: 2rem 1rem;
    }

    #devis-button,
    #call-button {
        font-size: .8rem;
        padding: 1rem 1.2rem;
    }

    a#call-button {
        margin-right: 0px;
        width: 44px;
        height: 44px;
        display: block;
        position: relative;
    }

    .space-section {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    span#seulement {
        position: absolute;
        left: -10px;
    }

    .text-service {
        padding: 0px 15px;
    }

    main#content {
        margin: 0px 0px;
    }

    section#section-contact i.icon-im_contact {
        font-size: 200px;
    }


    #offre h1#title,
    #offre #title-container {
        max-width: 250px;
    }

    a#button-web .speak {
        top: -64px;
        width: 311px;
        right: 0px;
    }

    #section-emotion .bubble {
        font-size: 16px !important;
        padding: 14px 19px;
    }

    #section-emotion .bubble:nth-child(1) {
        transform: scale(0) rotate(105deg);
        top: -25px;
        left: 90px;
    }

    #devis header,
    #devis section {
        padding: 2rem 0.5rem;
    }

    .keypoint {
        padding: 1rem 0rem;
    }

    #navigation.show {
        padding-right: 0px;
        width: 100%;
        border: 0px;
    }

    #nav-right-bloc {
        border-left: 0px;
        border-right: 0px;
    }

    #mobile-version-logo {
        display: none;
    }

    #nav-right-bloc div:nth-child(1) {
        border-bottom: 0px;
    }

    ul#main_menu_top {
        border-right: 0px;
    }
}

/************************************************************
	Taches
************************************************************/
.bgtotalmin {
    background-color: #a6a6a6 !important;
    font-weight: 600;
    font-size: 14px;
}

.bgtotalheure {
    background-color: #d9d9d9 !important;
    font-weight: 600;
    font-size: 14px;
}

.bgthread {
    background-color: #bfbfbf !important;
    font-weight: 600;
    font-size: 14px;
}

.bgoffer {
    background-color: #adebad !important;
    font-weight: 600;
    font-size: 14px;
}



/************************************************************
	FORFAIT ABT
************************************************************/

section#section-forfait-animation img {
    width: 50%;
    max-height: 100%;
    min-height: 50%;
    position: absolute;
    top: -18vh;
    left: -5vw;
    transform: rotate(-15deg);
}

section#section-forfait-animation {
    min-height: 70vh;
    position: relative;
    margin-left: .9375rem;
    margin-right: .9375rem;
    align-items: center;
}

section#section-forfait-animation .wordtitle {
    transform: rotate(-12deg);
    margin-top: 15vh;
}