/*
Theme Name: Agence Salto
Author: Salto
Author URI: https://www.agence-salto.com

*/

.GalanoGrotesque-Black { font-family: GalanoGrotesque-Black; }
.GalanoGrotesque-Bold { font-family: GalanoGrotesque-Bold; }
.GalanoGrotesque-ExtraBold { font-family: GalanoGrotesque-ExtraBold; }
.GalanoGrotesque-ExtraLight { font-family: GalanoGrotesque-ExtraLight; }
.GalanoGrotesque-Heavy { font-family: GalanoGrotesque-Heavy; }
.GalanoGrotesque-Light { font-family: GalanoGrotesque-Light; }
.GalanoGrotesque-Medium { font-family: GalanoGrotesque-Medium; }
.GalanoGrotesque-Regular { font-family: GalanoGrotesque-Regular; }
.GalanoGrotesque-SemiBold { font-family: GalanoGrotesque-SemiBold; }
.GalanoGrotesque-Thin { font-family: GalanoGrotesque-Thin; }

.stroke{
    /* https://css-tricks.com/adding-stroke-to-web-text/ */
    font-family: GalanoGrotesque-Bold;
    color: transparent;
    -webkit-text-fill-color: transparent; /* Will override color (regardless of order) */
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: black;
}

.home {}
.home .mask .social{position:absolute; bottom:0; right:0;}
.mask .menu_header{position:relative; bottom:20px; font-size: 15px;display:flex; justify-content: space-between; padding:0; list-style:none;}
.mask .menu_header .ico-rechercher{display:none;}
.home .s{
    position: absolute;
    display: block;
    right: -144px;
    top: -334px;
    width: 322px;
    height: 409px;}
.home .s img {
    will-change:transform;
	-webkit-transition: transform 0.2s;
	-moz-transition: transform 0.2s;
	transition: transform 0.2s;
}
.home .t img{width:204px; height:515px;left:0; z-index: 999;margin-top: -100px;}
.home .o img{width:417px; height:417px;right:-40px; z-index: 999;left: auto;margin-top: -100px;}

.page-404{min-height:500px;}
.page-404 h1.stroke{
    -webkit-text-stroke-color: #ffdd00;
    position: absolute;
    top:50%;
    left:50%;
     -ms-transform: translate(-50%, -50%); /* IE 9 */
    -webkit-transform: translate(-50%, -50%); /* Safari */
    transform: translate(-50%, -50%);
    font-size:40vw;
}
.page-404 .page-content{
     -ms-transform: translate(-50%, -50%); /* IE 9 */
    -webkit-transform: translate(-50%, -50%); /* Safari */
    transform: translate(-50%, -50%);
     position: absolute;
    top:50%;
    left:50%;
}
.page-404 .page-content p.texte{font-family: GalanoGrotesque-Bold; font-size:18px;line-height:1.3;margin-bottom:30px;}
#a-propos{font-family: GalanoGrotesque-Regular;}
#a-propos #intro{line-height: 1.3;}
#a-propos #intro h2{font-family: GalanoGrotesque-Bold;line-height: 1;position: relative; margin:0 0 0.6em;}

#a-propos .motcle.rsVer, #a-propos .motcle.rsVer .rsOverflow {
    height: 30px;
    width: 220px;
    color:#f6d70b;
    display: inline-block;
}
.pc #a-propos .motcle.rsVer, .pc #a-propos .motcle.rsVer .rsOverflow {height: 50px;}
.pc #a-propos .motcle.rsVer{margin-top:9px;}
#a-propos .motcle.rsVer{
    position: absolute;
    top:50%;
    left:178px;
    -ms-transform: translateY(-50%); /* IE 9 */
    -webkit-transform: translateY(-50%); /* Safari */
    transform: translateY(-50%);
}
#a-propos h3, #contact #formulaire h2{font-family: GalanoGrotesque-Bold; line-height: 1;margin-bottom: 0.8em;}
#a-propos .salto-vertical{top: 50px;
    position: absolute;
    left: calc(50% + 222px);
    width: 120px;
    height: 414px; 
}


#a-propos #services{ }
#a-propos #services .container, #a-propos #services .row{position: relative;}
#a-propos #services .tabs-outer{display:block; width:540px;margin-top: 30px;margin-bottom: 30px; padding:0;margin-left: 15px;}
#a-propos #services .tabs-outer{}
#a-propos #services ul{list-style:none;margin:0;padding:0;}
#a-propos #services .tabs,
#a-propos #services .titre{
    font-size:28px;
    font-family: GalanoGrotesque-Bold; 
}
#a-propos #services .tabs{width:230px;display:inline-block;margin-right:10px;}
#a-propos #services .tabs a{
    color: #000;
    -webkit-text-fill-color: #000; /* Will override color (regardless of order) */
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #FFF;
}
#a-propos #services .tabs .active a, 
#a-propos #services .titre{
    color:#f6d70b; 
    -webkit-text-fill-color: #f6d70b; /* Will override color (regardless of order) */
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: transparent;
    text-decoration: underline;
}
#a-propos #services .tab-content{display:inline-block;vertical-align: top; width:290px;margin-top: 15px;font-family: GalanoGrotesque-SemiBold;}
#a-propos #services .tab-content li, #a-propos #services .royalSlider li{margin-bottom:12px;}
#a-propos #services .royalSlider .rsContent{padding-bottom:20px;}
#a-propos #services .royalSlider{width:100%;margin-top: 30px;margin-bottom: 30px; height:320px;}
#a-propos #services .a2c{}
#a-propos #services .a2c img{vertical-align: middle;}

#a-propos #equipe{position:relative;overflow: hidden;}
#a-propos #equipe .photos{width:100%; height:300px;}
#a-propos .photo_fullwidth_equipe{height:300px;}
#a-propos #demo h2{
    text-align:center; 
    position: relative;
    font-size: 50px;
    margin-bottom: -20px;
    z-index: 100;
    margin-top:0;
}
#a-propos .demo_reel{position: relative; z-index: 10;}
#a-propos .demo_reel a{width:100%; position:relative;}
#a-propos .demo_reel, #a-propos .demo_reel a{ z-index: 1;}
#a-propos .demo_reel .spacer{width:100%;}
#a-propos #direction .bt{font-family: GalanoGrotesque-SemiBold;background-color:#FFF; border:none; position: relative;padding-left:54px; padding-right:54px;}
#a-propos h4{font-size:30px;font-family: GalanoGrotesque-SemiBold;margin-bottom: 0;}
#a-propos #direction .bt.linkedin{padding-left:0; padding-right:0; width:60px;}
#a-propos #direction .bt svg{
    position:absolute;
    top:50%;
    left:50%;
    -ms-transform: translate(-50%, -50%); /* IE 9 */
    -webkit-transform: translate(-50%, -50%); /* Safari */
    transform: translate(-50%, -50%);
    width:30px;
    margin-top: -2px;
}
#a-propos #direction .bt:hover{background-color:#000; color:#FFF;}
#a-propos #direction .bt:hover path{fill:#FFF;}

#a-propos #direction h2{margin:0 0 -15px; z-index:10; position: relative;}
#a-propos #philosophie hr{margin-left:15px; margin-right:15px; border-color:rgba(255,255,255,0.5);}
#a-propos #direction .social{margin-top:1em;}

.royalSlider .rsBullets{width:100%; text-align:left; z-index:999; position:absolute; bottom:0;}
#equipe .royalSlider .rsBullets{text-align:center;}
.royalSlider .rsBullets .rsBullet{
    width:10px; 
    height: 10px;
    display:inline-block;
    margin:0 2px;
    -webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
    border:1px solid #FFF;
    cursor: pointer;
}
.royalSlider .rsBullets .rsBullet.rsNavSelected{background-color:#FFF;}

.grecaptcha-badge{display:none!important;}
#contact #intro{position:relative;}   
#contact #intro .o img{
    position:absolute; 
    display: block; 
    top:50%;
    left:50%;  
    -ms-transform: translate(-50%, -50%); /* IE 9 */
    -webkit-transform: translate(-50%, -50%); /* Safari */
    transform: translate(-50%, -50%);
    width:680px; height:680px;
    max-width:100%;
}
#contact .s, #contact .s img{height:409px;}
#contact .s img{
    position:absolute; 
    display: block; 
    right:0;
    width:322px;
    -ms-transform: rotate(-90deg); /* IE 9 */
    -webkit-transform: rotate(-90deg); /* Safari */
    transform: rotate(-90deg);
    max-width:100%;
}
.safari.iphone #contact .s img{right:10%;}
#contact{}
#contact #intro{}
#contact #intro h2{font-family: GalanoGrotesque-Bold;line-height: 1; margin-bottom: 30px;}
#contact #intro .rotation-wrapper-outer{
    position:absolute; 
    top:0;
    left:50px;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.gform_wrapper .gform_ajax_spinner {
    position: relative;
    left: 50%;
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

#contact .coordonnees .bt{padding-left:0; padding-right:0;}
#contact .coordonnees .bt,
#contact #formulaire .gform_button{
    width:100%; 
    text-align:center;
    background-color:#000; 
    color:#FFF;
    border-color:#000;
}
#contact .coordonnees .bt:hover,
#contact #formulaire .gform_button:hover{background-color:#FFF; color:#000;}
#contact #formulaire .gform_drop_instructions{color:white;}
.gform_validation_errors{display:none!important;}

#contact #formulaire .gform_button_select_files{
	width:100%; 
    text-align:center;
    background-color:#000; 
    color:#FFF;
    border-color:#000;
	border-radius:0;
	border:1px solid black;
	box-shadow:none;
	padding:10px 20px;
	max-width:360px;
}

#contact #formulaire{}
#contact #formulaire input,
#contact #formulaire textarea,
#contact #formulaire .fichier{
    background-color:transparent;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-appearance: none;
}
#contact #formulaire .fichier input{border:none;padding:0;}
body .gform_wrapper .top_label div.ginput_container{margin-top:0 !important;}
#contact #formulaire .preference{
    text-transform: uppercase;
    font-size: 13px;
    letter-spacing: 2px;
}
#contact #formulaire input,
#contact #formulaire textarea,
#contact #formulaire .fichier,
#contact #formulaire .preference{
     border: 1px solid rgba(255,255,255,0.5); padding:16px;
}
#contact #formulaire .preference label{width:calc(100% - 16px);display:inline-block; vertical-align: top;margin-top: 0;}
#contact #formulaire .preference .ginput_container{width:calc(100% - 16px);display:inline-block; margin-top: 0; vertical-align: top;}
#contact #formulaire .preference .gfield_radio,
#contact #formulaire .preference .gfield_radio li,
#contact #formulaire .preference input{margin:0;}


#contact #formulaire .gform_wrapper li.gfield.gfield_error, .gform_wrapper li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
    background-color: transparent;
    margin-bottom: 0 !important;
    border:none;
    padding-top: 0;
    box-sizing: border-box;
}
#contact #formulaire .gform_wrapper li.gfield.gfield_error input, 
#contact #formulaire .gform_wrapper li.gfield.gfield_error textarea{border-color:red;}
#contact #formulaire .gform_wrapper .validation_message{color:red;padding-top:0;}
#contact #formulaire .gform_wrapper div.validation_error {
    color: red;
    border-top-color: red;
    border-bottom-color: red;
}
#contact #formulaire .one-third input{width:100%;}
#contact #formulaire .gform_wrapper{position:relative;}
.gform_wrapper ul.gform_fields li.gfield{padding-right:0 !important;}
.gform_wrapper .fichier{position:relative; text-align:center;}
.gform_wrapper .fichier *{cursor:pointer;}
.gform_wrapper .fichier .ginput_container_fileupload {display: none !important;}
.gform_wrapper .fichier .gfield_label:before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    background-image: url(images/svg/ico-upload.svg);
    width: 22px;
    height: 28px;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    -ms-transform: translate(-122px, -50%);
    -webkit-transform: translate(-122px, -50%);
    transform: translate(-122px, -50%);
}
#contact ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  opacity: 1 !important;
    color:#FFF;
  font-family: GalanoGrotesque-Medium;
  opacity: 1 !important;
}
#contact :-ms-input-placeholder { /* Internet Explorer 10-11 */
  opacity: 1 !important;color:#FFF;
  font-family: GalanoGrotesque-Medium;
  opacity: 1 !important;
}
#contact ::-ms-input-placeholder { /* Microsoft Edge */
  opacity: 1 !important;color:#FFF;
  font-family: GalanoGrotesque-Medium;
  opacity: 1 !important;
}
::-moz-placeholder {
  opacity: 1 !important;color:#FFF;
}
#contact #formulaire .gform_button{padding-top: 15px; padding-bottom:16px;}
#contact #formulaire .gfield_radio{}
#contact #formulaire .gfield_radio li{position:relative;}
#contact #formulaire .gfield_radio li input{display:none;}
#contact #formulaire .gfield_radio li label{position:relative; padding-left:22px;}
#contact #formulaire .gfield_radio li label:before{
    content:"";
    display:block;
    width:12px;
    height:12px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color:#FFF;
    position: absolute;
    top:50%;
    left:0;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
#contact #formulaire .gfield_radio li input:checked ~ label:after{
    content:"";
    display:block;
    width:8px;
    height:8px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color:#000;
    position: absolute;
    top:50%;
    left:2px;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}


#contact .ns{}
#contact .ns .outer{padding:65px 30px 55px;margin-bottom:30px;}
#contact .inner{max-width:380px; display: block; margin:0 auto 30px;font-family: GalanoGrotesque-Regular;}
#contact .ns h2, #contact #intro .adresse{font-family: GalanoGrotesque-Bold; line-height: 1;}
#contact #intro .adresse{font-size: 30px;margin:20px 0 30px;}
#contact .ns .tag:first-child, #contact .ns .bt{margin-bottom:60px;}
#contact .ns .bt{color:#FFF;}
#contact .ns .bg-noir .bt{border-color:#ff6f55;}
#contact .ns .bg-noir .bt:hover{background-color:#ff6f55;}
#contact .ns .bg-saumon .bt{border-color:#000;}
#contact .ns .bg-saumon .bt:hover{background-color:#000;}
.gform_wrapper ul.gfield_radio li {
    display: inline-block;
    width: 50%;
}
#contact .social svg path {
    fill: #FFF !important;
    will-change:opacity;
    -webkit-transition: opacity 0.2s;
    -moz-transition: opacity 0.2s;
    transition: opacity 0.2s;
}

#contact .social ul{display: inline;}
#contact .social ul li{padding:0;}
#contact .social ul li a{padding:0 5px;}
#contact .social ul:hover li a svg path {opacity:0.5;}
#contact .social ul:hover li a:hover svg path {opacity:1;}
#contact #intro .lien_carte{display: block;}



@media (max-width: 500px) {
    #a-propos .motcle.rsVer{
        position: relative;
        top:auto;
        left:auto;
        -ms-transform: translateY(0); /* IE 9 */
        -webkit-transform: translateY(0); /* Safari */
        transform: translateY(0);
        margin:4px 0 -4px;
    }
    #a-propos .motcle.rsVer, #a-propos .motcle.rsVer .rsOverflow {width: 100%;}
}
@media (max-width: 767px) {
	/* XS-SMALL ONLY */
    #a-propos #services .a2c img{max-width:47%;}
   #contact #intro .rel .lien_carte{position:relative; z-index: 900; margin-bottom:-60px;}
    #contact #intro .lien_carte{color:#FFF;}
    #contact .coordonnees{background-color:#0000ff;padding-top:80px;}
    #contact .coordonnees .adresse{color:#ffffff;}
    #contact #formulaire{background-color:#000; padding-top:30px;margin-top: 30px;}
    #contact .bg-bleu .tag, #contact .social{text-align:center;}
    #contact #formulaire .gf_third{width:calc(100% - 16px);}
    #contact #formulaire .gform_button{background-color:#0000ff;}
    #contact #formulaire input, 
    #contact #formulaire textarea{margin-top:0;} 
    #contact #formulaire .fichier{margin-top: 16px;}
    #contact #formulaire .preference{margin-top: 10px;}
    #contact section.bg-bleu{padding-bottom:0;}
    .home .mask:after{
        content:"";
        display: block;
        width:100%;
        bottom: 36px;
        height:50px;
        left:0;
        position: absolute;
        background-color:#FFF;
    }
    .mask .menu_header{position:relative; z-index:999;}
    #a-propos #direction .associe-0{margin-bottom:50px;}
}

@media (min-width: 768px) {
	/* SMALL */
    .rotation-wrapper-outer {display: table;}
    .rotation-wrapper-inner {padding: 50% 0;height: 0;}
    .element-to-rotate {
          display: block;
          transform-origin: top left;
          /* Note: for a CLOCKWISE rotation, use the commented-out
             transform instead of this one. */
          transform: rotate(-90deg) translate(-100%);
          /* transform: rotate(90deg) translate(0, -100%); */
          margin-top: -50%;

          /* Not vital, but possibly a good idea if the element you're rotating contains
             text and you want a single long vertical line of text and the pre-rotation
             width of your element is small enough that the text wraps: */
          white-space: nowrap;
    }
    
    
    .home .mask .social{bottom:64px; right:15px;}
    .mask .menu_header{display:none;}
    
    .page-404 .page-content p.texte{font-size:38px;}
    
    #a-propos #equipe .photos{position:absolute; width:50%; top:0; right:0;}
    #a-propos .salto-vertical{top: 100px;}
    #a-propos .photo_fullwidth_equipe{height:500px;}
    
    #a-propos #services{font-size:20px;}
    #a-propos #services .rotation-wrapper-outer{margin-bottom: 30px;}
    #a-propos #services .tabs, #a-propos #services .titre{font-size:42px;}
    #a-propos #services .a2c {margin: 6em 0 0;}
    #a-propos #demo h2{margin-bottom:-40px;font-size:80px;-webkit-text-stroke-width: 2px;}
    #a-propos #direction h2{font-size:46px;}
    #a-propos #philosophie{position:relative;}
    #a-propos #philosophie .rotation-wrapper-outer{
        position:absolute;
        top:50%;
        left:50%;
        -ms-transform: translateY(-50%); /* IE 9 */
        -webkit-transform: translateY(-50%); /* Safari */
        transform: translateY(-50%);
        margin-left: -5px;
    }
    #a-propos #philosophie .rotation-wrapper-outer:before,
    #a-propos #philosophie .rotation-wrapper-outer:after{
        content:"";
        display:block;
        width:1px;
        height:100px;
        background-color:rgba(255,255,255,0.5);
        position:absolute;
        left:6px;
        top:120%;
    }
    #a-propos #philosophie .rotation-wrapper-outer:after{top:auto; bottom:120%;}
    #a-propos #philosophie .texte{padding-top:30px;padding-bottom:30px;}
    #a-propos #direction .social{margin-top:3em;}
    
    #contact #intro h2{margin-bottom: 120px;font-size:60px;}
    #contact #formulaire .gform_fields{position:relative;}
    #contact #formulaire .one-third{width:49%; margin-top:0;padding-right:0;}
    #contact #formulaire .nom input{margin-top:0;}
    #contact #formulaire .preference{ margin-top:10px;padding:12px 0 8px 16px;}
    #contact #formulaire .fichier{margin-top: 2px;margin-left: 0 !important; padding:14px 16px 14px;}
    #contact #formulaire .message{width: calc(50% - 2px); position:absolute; top:0; right:0;margin-top: 74px;}
    #contact #formulaire input, #contact #formulaire textarea{margin-top:10px;}
    #contact #formulaire textarea{height:352px;}
    .safari #contact #formulaire textarea{height:348px;}
    .safari.iphone #contact #formulaire textarea{height:282px;}
	#contact #formulaire .gform_button {position:absolute;bottom:-50px; right:0;}
    #contact #formulaire .preference label{width:160px;}
    #contact #formulaire .preference .ginput_container{width:calc(100% - 160px);}
    #contact #formulaire .nom{margin-top:0;}
    #contact #intro .adresse{font-size: 25px;margin:0 0 20px;} 
    #contact #intro .coordonnees .tag{margin-top:10px;} 
    #contact #intro .lien_carte img{
        -webkit-box-shadow: 0px 20px 20px -20px rgba(0,0,0,0.58);
        -moz-box-shadow: 0px 20px 20px -20px rgba(0,0,0,0.58);
        box-shadow: 0px 20px 20px -20px rgba(0,0,0,0.58);
    }
    #contact #intro{margin-bottom:-80px;}
    
    #contact #formulaire h2{height: 66px;}
    #contact #formulaire .gform_confirmation_message h2{height:auto !important; font-size:65px; margin-top:1em; margin-bottom:0;}
    #contact #formulaire .message{margin-top:80px;}
    .gform_wrapper .gform_ajax_spinner {
        padding-left: 0 !important;
        position: absolute;
        top: 90px;
        left: 50%;
        -ms-transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }
    #contact .bg-bleu .tag{margin-left:12px;}
    #contact .ns .outer{margin-bottom:0;}
}
@media (max-width: 991px) {
    
    .gform_wrapper .top_label li.gfield.gf_left_third:not(.gfield_time_hour):not(.gfield_time_minute):not(.gfield_time_ampm), .gform_wrapper .top_label li.gfield.gf_middle_third:not(.gfield_time_hour):not(.gfield_time_minute):not(.gfield_time_ampm){width:100%;}
    #contact #formulaire .preference,
    #contact #formulaire .fichier{width:100%;}
}
@media (min-width: 992px) {
	/* MEDIUM */
    .home .mask .social{bottom:90px;}
    #a-propos .motcle.rsVer, #a-propos .motcle.rsVer .rsOverflow {height: 60px; width: 425px;}
    .pc #a-propos .motcle.rsVer, .pc #a-propos .motcle.rsVer .rsOverflow {height: 80px;}
    #a-propos .motcle.rsVer{left:352px;}
    #contact #formulaire .gform_button {bottom:-100px;}
    #a-propos #intro h2{font-size:60px;}
    #a-propos #intro{font-size:28px;}
    #a-propos h3{font-size:30px;}
    #a-propos #demo h2{margin-bottom:-60px;font-size:130px;}
    #a-propos .photo_fullwidth_equipe{height:730px;}
    #a-propos #direction h2{font-size:86px;margin-bottom:-40px;}
    #a-propos .salto-vertical{left: calc(50% + 310px);width: 200px;height: 498px;}
    #a-propos #philosophie .texte{padding-top:60px;padding-bottom:60px;}
    #a-propos #philosophie .rotation-wrapper-outer:before,
    #a-propos #philosophie .rotation-wrapper-outer:after{height:130px;}
    #a-propos #services .tabs{width:160px;}
    #a-propos #services .tabs, #a-propos #services .titre {font-size: 28px;}
    #a-propos #services .tabs-outer{width:48%;margin-top:16px;}
    #a-propos #services .tab-content{margin-top: 8px;}
    
    #contact #intro{margin-bottom:-100px;}
    #contact #formulaire .fichier{margin-top: 10px;margin-left: 11px !important;}
    #contact #formulaire .one-third{width:33.3%;}
    #contact #formulaire .message{width:calc(66.6% - 10px);}
    #contact .inner{font-size:20px;}
    #contact .ns .bt{width:100%; max-width:325px; text-align: center; display: block; margin-left:auto; margin-right:auto;}
    #contact #formulaire .gform_wrapper .gform_footer{
        position:absolute;
        width:calc(33.3% - 18px);
        z-index:1000;
/*        bottom: 36px;*/
        bottom: 32px;
        right: 0;
    }
    .chrome #contact #formulaire .gform_wrapper .gform_footer{bottom:30px;}
    .safari #contact #formulaire .gform_wrapper .gform_footer{ bottom: 34px;}
    .gform_wrapper ul.gfield_radio li {display: block;width: 100%;}
    #contact #intro .adresse{margin:0 0 40px;} 
    #contact #intro .coordonnees .tag{margin-top:20px;} 
    #contact #formulaire h2{font-size:38px;margin-top: 2em;height: 80px;}
    #contact #formulaire .message{margin-top:100px;}
    #contact .bg-bleu .tag{margin-top: -60px;}
    .safari #contact .bg-bleu .tag{margin-top: 0;}
    
}
@media (min-width: 1200px) {
    /* LARGE */	
    .home .mask .social{bottom:114px;}
    
    #a-propos h3{font-size:58px;}
    #a-propos #services h3{font-size:45px;}
	
    #a-propos #demo h2{margin-bottom:-75px;font-size:160px;}
    #a-propos #services .tabs-outer{position:absolute; top:8px; right: 50px;margin-top:0;}
    #a-propos #philosophie .texte{padding-top:100px;padding-bottom:100px;}
    #a-propos #philosophie .rotation-wrapper-outer:before,
    #a-propos #philosophie .rotation-wrapper-outer:after{height:165px;}
    #a-propos #services .tabs{width:230px;}
    #a-propos #services .tabs, #a-propos #services .titre {font-size: 42px;}
    #a-propos #services .tabs-outer{width:540px;margin-top:4px;}
    #a-propos #services .tab-content{margin-top: 15px;}
    #a-propos #direction section{padding-top:80px; padding-bottom: 80px;}
    
    #contact #intro{margin-bottom:-150px;}
    #contact .ns h2{font-size:55px;margin-bottom:16px;}
    #contact .ns .tag:first-child, #contact .ns .bt{margin-bottom:120px;}
    #contact .social svg {width: 51px;height: 34px;}
    #contact .bg-bleu .tag{margin-left:16px;}
}
@media (min-width: 1400px) {
    /* XX-LARGE */	
    .home .mask .social{bottom:140px;}
    #a-propos .motcle.rsVer{left:500px;}
    #a-propos .motcle.rsVer, #a-propos .motcle.rsVer .rsOverflow {height: 84px; width: 600px;}
    .pc #a-propos .motcle.rsVer, .pc #a-propos .motcle.rsVer .rsOverflow {height: 104px;}
    #a-propos #intro h2, #contact #intro h2{font-size:85px;}
    
	#a-propos #demo h2{/*margin-bottom:-102px;font-size:190px;*/}
    #a-propos #intro { padding: 210px 0;}
    #a-propos .salto-vertical{left: calc(50% + 435px); width: 250px;height: 860px;top: 200px;}
    #contact #intro{margin-bottom:-200px;}
    
    #a-propos #services .rotation-wrapper-outer{margin-bottom: 60px;}
    #a-propos #services .tabs-outer{width: 540px;}
    
}
@media (min-width: 1500px) {
#contact #intro .adresse{font-size: 40px;} 
}