@charset "utf-8";

.body {
    position: absolute;
    margin: auto;
    width: 100%;
    background: #04172B;
    background-attachment: fixed;
    background-repeat: no-repeat;
    font-family: Arial;
    *font-family: Raleway ,Tahoma, Helvetica,sans-serif;
    -webkit-background-size: 1000px 85%;
    -moz-background-size: 1000px 85%;
    background-size: cover;
}



#wrap {min-height: 100%}


/***************************************************************************************************************************************\
                                                            MIN 1550PX
                                                            MAX 1920PX
                                                     VERSION DESKTOP GRAND ECRAN
\*****************************************************************************************************************************************/

@media (min-width: 1551px) {

    #triangle-1 {
        width: 0;
        height: 0;
        border-left: 12px solid transparent;
        border-right: 12px solid transparent;
        border-bottom: 12px solid #7bcac7;
    }

    #triangle-2 {
        width: 0;
        height: 0;
        border-left: 12px solid transparent;
        border-right: 12px solid transparent;
        border-top: 12px solid #7bcac7;
        text-align: center;
        margin-bottom: 25px;
    }

    section.accueil #solutions {
        margin: 10px 30px;
    }

    #edito #triangle-1, #solutions #triangle-1, #edito #triangle-2, #solutions #triangle-2 {
        margin-left: 142px;
    }

    #vocations #triangle-1, #vocations #triangle-2 {
        margin-left: 160px;
    }

    #logo_camileia_entete{
        margin-top: -265px;
        z-index: 1;
        margin-left: 350px;
        position: absolute;
    }

    .site-container{
        background: white;
        margin: auto;
        max-width: 1400px;
    }

    .header__icon{
        position: relative;
        display: block;
        float: left;
        width: 70px;
        height: 66px;
        cursor: pointer;
    }

    #mention_légale{
        font-size: small;
        padding: 2% 6%;
        margin-left: -4%;
        margin-right: -4.2%;
	    display: flex;
    }

    .footer{
        width: 1400px;
        margin: auto;
        background-color: #04172B;
        color: white;
        font-weight: bold;
        padding-bottom: 10px;
    }

    #adresse1{
        position: absolute;
        display: block;
        margin-left: 135px;
        margin-top: 460px;
        text-align: center;
        height: auto;
        font-size: 40px;
    }

    #corps_presentation{
        padding-left: 8%;
        font-size: 20px;
    }

    #text_krim_bechina{
        position: absolute;
        margin-left: 7%;
        margin-top: -1%;
        top: 24%;
        font-size: 45px;
    }

    #text_sms{
        position: absolute;
        margin-left: 7%;
        margin-top: -1%;
        top: 24%;
        font-size: 45px;
    }

    #text_sms_titre{
        position: absolute;
        margin-left: 7%;
        margin-top: -1%;
        top: 24%;
        font-size: 5vw;
    }

    .krim_bechina{
        background: black;
        float: inherit;
        position: relative;
        margin-right: -72px;
        margin-left: -64px;
    }

    #img_losange_camileia{
        width: 4%;
        vertical-align: middle;
    }

    .text_presentation_camileia{
        background: black;
        color: white;
        padding: 4% 9%;
        margin-right: -72px;
        margin-left: -85px;
        font-size: 20px;
    }

    .animation{
        top: 0;
        *width: 625px;
        *margin-right: 100px;
        overflow: hidden;
        z-index: 1;
        *margin-left: 837px;
    }

    #video_animation{
        width: 100%;
        margin-top: 70px;
    }

    #image_scroll{
        position: absolute;
        top: 731px;
        z-index: 2;
        margin-left: 752px;
        -webkit-margin-start: 752px;
        -moz-margin-start : 18px;
    }

    #transparent{
        background: #fff;
        *background-color: rgba(255, 255, 255, 0.75);
        margin-left: auto;
        margin-right: auto;
        margin-top: 1800px;
    }

    #menu_hamburger{
        width: 170px;
    }

    .header__icon:after {
        content: '';
        position: absolute ;
        display: block;
        width: 1.5rem;
        height: 0;
        top: 18px;
        left: 26px;
        box-shadow: 0 5px 0 1px #7bcac7, 0 13px 0 1px #7bcac7, 0 21px 0 1px #7bcac7, 0 29px 0 1px #7bcac7;
    }

    .nav {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        -webkit-overflow-scrolling: touch;
        background-color: #000009;
        transform: translateX(-100%);
        list-style-type: none;
        z-index: 1;
        height: 100%;
    }

    .nav a {
        display: block;
        height: 40px;
        text-align: center;
        line-height: 40px;
        color: #FFFFff;
    }

    .nav a:hover,
    .nav a:focus{
        color: #000000;
        background: #FFFFff;
    }

    .with--sidebar .site-pusher {
        transform: translateX(10em);
    }

    .with--sidebar .site-cache {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.6);
        z-index: 10;
    }

    .site-pusher{
        transition-duration: 0.3s;
    }

    #logo_camileia {
        width: 50%;
        margin-top: 150px;
        position: relative;
        margin-left: 35px;
    }

    #articleSMS1{
        padding: 20px 10px 30px;
        width: auto;
        height: auto;
        color: #3d3d3b;
        font-family: Raleway ,Tahoma, Helvetica,sans-serif;
        font-size: 30px;
        font-weight: normal;
    }

    #articleSMS2{
        padding: 20px 10px 30px;
        width: auto;
        height: auto;
        color: #3d3d3b;
        font-family: Raleway ,Tahoma, Helvetica,sans-serif;
        font-size: 29px;
        font-weight: normal;
    }

    .articleh1{
        font-size: 3vw;
    }

    .titre_div{
        vertical-align: middle;
        color: #7bcac7;
        font-size: 50px;
    }

    .mp-menu > .mp-level{
        display: none;
    }

    .mp-menu > .mp-level.mp-level-open,
    .mp-menu.mp-overlap > .mp-level,
    .mp-menu.mp-overlap > .mp-level.mp-level-open {
        display: block;
    }

    .mp-cover .mp-level.mp-level-open > ul > li > .mp-level:not(.mp-level-open){
        display: none;
    }

    .align_image {
        height: 100px;
        vertical-align: middle;
        margin-right: 31px;
    }

    #image1_align{
        margin-left: 333px;
    }

    #graphique_reporting_decisionnel{
        width: 50%;
        float: right;
    }

    #txtVerdure {
        font-size: 35px;
        margin-top: -175px;
        line-height: 45px;
    }

    .schemaUTSY input:checked + label img {
        -webkit-transform: translate(-500px, -120px) scale(3);
        -moz-transform: translate(-500px, -120px) scale(3);
        -o-transform: translate(-500px, -120px) scale(3);
        transform: translate(-500px, -188px) scale(3);
        cursor: zoom-out;
    }
    .list-double{
        float: left;
        width: 50%;
    }

    .contenuDouble{
        display: inline-block;
        height: 200px;
    }
}

/***************************************************************************************************************************************\
                                                            MIN 1025PX
                                                            MAX 1550PX
                                                    VERSION TABLETTE PAYSAGE
\*****************************************************************************************************************************************/


@media (max-width: 1550px) {

    #adresse1{
        position: absolute;
        display: block;
        margin-left: 130px;
        margin-top: 372px;
        text-align: center;
        height: auto;
        font-size: 32px;
    }

    .articleh1{
        font-size: 4.7vw;
    }

    #articleSMS {
        margin-bottom: 10%;
    }

    #articleSMS1{
        padding: 20px 10px 30px;
        width: auto;
        height: auto;
        color: #3d3d3b;
        font-family: Raleway ,Tahoma, Helvetica,sans-serif;
        font-size: 3vw;
        font-weight: normal;
    }

    #articleSMS2{
        padding: 20px 10px 30px;
        width: auto;
        height: auto;
        color: #3d3d3b;
        font-family: Raleway ,Tahoma, Helvetica,sans-serif;
        font-size: 2.1vw;
        font-weight: normal;
    }

    .header__icon{
        position: relative;
        display: block;
        float: left;
        width: 80px;
        height: 66px;
        cursor: pointer;
    }

    #logo_header{
        width: 194px;
        height: 66px;
    }

    #menu_hamburger{
        width: 170px;
    }

    .header__icon:after {
        content: '';
        position: absolute ;
        display: block;
        width: 1.5rem;
        height: 0;
        top: 18px;
        left: 26px;
        box-shadow: 0 5px 0 1px #7bcac7, 0 13px 0 1px #7bcac7, 0 21px 0 1px #7bcac7, 0 29px 0 1px #7bcac7;
    }

    .nav {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        -webkit-overflow-scrolling: touch;
        background-color: #000009;
        transform: translateX(-100%);
        list-style-type: none;
        z-index: 1;
        height: 100%;
    }

    .nav a {
        display: block;
        height: 40px;
        text-align: center;
        line-height: 40px;
        color: #FFFFff;
    }

    .nav a:hover,
    .nav a:focus{
        color: #000000;
        background: #FFFFff;
    }

    .with--sidebar .site-pusher {
        transform: translateX(10em);
    }

    .with--sidebar .site-cache {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.6);
        z-index: 10;
    }


    .site-content{
        position: absolute;
        /*top: 105px;*/
        right: 0;
        left: 0;
        bottom: 0;
        padding-top: 0;
        overflow-y: scroll;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
        background: #FFF;
    }

    .site-pusher{
        transition-duration: 0.3s;
    }

    .site-container {
        background: white;
        margin: auto;
        width: 100%;
    }

    #logo_camileia{
        margin-left: 40px;
        margin-top: 125px;
        position: relative;
        width: 50%;
    }

    #header {
        width: 100%;
    }

    .footer{
        width: 100%;
        margin: auto;
        background-color: #04172B;
    }

    #corps_presentation{
        padding-left: 8%
    }

    #text_krim_bechina{
        position: absolute;
        margin-left: 7%;
        top: 24%;
        font-size: 2.7vw;
    }

    #text_sms {
        position: absolute;
        margin-left: 7%;
        top: 20%;
        font-size: 3vw;
    }

    #text_sms_titre{
        position: absolute;
        margin-left: 7%;
        margin-top: -1%;
        top: 24%;
        font-size: 5vw;
    }

    .krim_bechina{
        background: black;
        float: inherit;
        position: relative;
        margin-right: -1%;
        margin-left: -1%;
    }


    #img_losange_camileia{
        width: 4%;
        vertical-align: middle;

    }

    .div_presentation_camileia{
        padding-left: 20px;
    }

    .text_presentation_camileia{
        background: black;
        color: white;
        padding: 4% 6%;
        margin-right: -1%;
        margin-left: -3%;
        font-size: 18px;
    }

    #image_scroll{
        display: none;
    }

    .animation{
        top: 0;
        overflow: hidden;
        z-index: 1;
    }

    #video_animation{        
        margin-top: 70px;
        width: 100%;
    }

    #presentation{
        position: absolute;
    }

    #nompage{
        margin-left: 30px;
        margin-top: 165px;
        position: absolute;
    }

    #transparent{
        margin-top: 730px;
        margin-right: auto;
        margin-left: auto;
        background: rgba(255, 255,255, 0.75) none repeat scroll 0 0;
    }
    
    .body{
    	background: none;
    }

    #mention_légale{
        display: flex;
    }

    .titre_div{
        vertical-align: middle;
        color: #7bcac7;
        font-size: 2.5vw;
    }

    .align_image {
        height: 100px;
        vertical-align: middle;
        padding: 10px;
    }

    #image1_align{
        margin-left: 333px;
    }

    #graphique_reporting_decisionnel{
        width: 50%;
        float: right;
    }

    section.edito {
        margin: 40px 0;
        padding: 40px 50px;
    }

    section.accueil {
        padding-top: 109px;
        min-height: 1330px;
        color: black;
        width: 1160px;
        margin: auto;
    }

    section.solutions_gris {
        padding: 40px 60px;
        clear: both;
    }

    section.proteus{
        padding: 40px 60px;
        clear: both;
    }

    #logo_camileia_entete{
        margin-top: -18%;
        z-index: 1;
        margin-left: 25%;
        position: absolute;
    }

    #formulaireContact table {
        margin: 0;
        width: 100%;
    }

    #formulaireContact input, #formulaireContact textarea, #formulaireContact select {
        width: 100%;
    }

    .slideshow2 {
        height: 585px;
    }

    .slideshow input:checked + label img {
        -webkit-transform: translate(-250px) scale(2);
        -moz-transform: translate(-250px) scale(2);
        -o-transform: translate(-250px) scale(2);
        transform: translate(-250px) scale(2);
        cursor: zoom-out;
    }

    .contenuDouble{
        display: inline-block;
        height: 200px;
    }
}


/***************************************************************************************************************************************\
                                                            MIN 768PX
                                                            MAX 1023PX
                                                     VERSION TABLETTE PORTRAIT
/***************************************************************************************************************************************/


@media (max-width: 1023px){

    #adresse1 {
        position: absolute;
        display: block;
        margin-left: 62px;
        margin-top: 330px;
        text-align: center;
        height: auto;
        font-size: 25px;
    }

    #articleSMS1{
        padding: 20px 10px 30px;
        width: auto;
        height: auto;
        color: #3d3d3b;
        font-family: Raleway ,Tahoma, Helvetica,sans-serif;
        font-size: 2.7vw;
        font-weight: normal;
    }

    #articleSMS2{
        padding: 20px 10px 30px;
        width: auto;
        height: auto;
        color: #3d3d3b;
        font-family: Raleway ,Tahoma, Helvetica,sans-serif;
        font-size: 2vw;
        font-weight: normal;
    }

    .site-content{
        position: absolute;
        /*top: 105px;*/
        right: 0;
        left: 0;
        bottom: 0;
        padding-top: 0;
        overflow-y: scroll;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
        background: #FFF;
    }

    .articleh1{
        font-size: 33px;
    }

    #header {
        width: 100%;
    }

    .header__icon{
        position: relative;
        display: block;
        float: left;
        width: 80px;
        height: 66px;
        cursor: pointer;
    }

    #logo_header{
        width: 194px;
        height: 66px;
    }

    #menu_hamburger{
        width: 170px;
    }

    .header__icon:after {
        content: '';
        position: absolute ;
        display: block;
        width: 1.5rem;
        height: 0;
        top: 18px;
        left: 26px;
        box-shadow: 0 5px 0 1px #7bcac7, 0 13px 0 1px #7bcac7, 0 21px 0 1px #7bcac7, 0 29px 0 1px #7bcac7;
    }

    .nav {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        -webkit-overflow-scrolling: touch;
        background-color: #000009;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        list-style-type: none;
        z-index: 1;
        height: 100%;
    }

    .nav a {
        display: block;
        height: 40px;
        text-align: center;
        line-height: 40px;
        color: #FFFFff;
    }

    .nav a:hover,
    .nav a:focus{
        color: #000000;
        background: #FFFFff;
    }

    .with--sidebar .site-pusher {
        transform: translateX(10em);
    }

    .with--sidebar .site-cache {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.6);
        z-index: 10;
    }

    .site-container {
        background: white;
        margin: auto;
        width: 100%;
    }

    .site-pusher{
        transition-duration: 0.3s;
    }

    .article{
        margin-top: 0%;
    }

    .krim_bechina{
        background: black;
        float: inherit;
        position: relative;
        margin-left: -3.8%;
    }

    #text_krim_bechina{
         position: absolute;
         margin-left: 7%;
         margin-top: -1%;
         top: 24%;
         font-size: 30px;
     }

    #text_sms{
        position: absolute;
        margin-left: 7%;
        margin-top: -1%;
        top: 24%;
        font-size: 30px;
    }

    #text_sms_titre{
        position: absolute;
        margin-left: 7%;
        margin-top: -1%;
        top: 15%;
        font-size: 5vw;
    }

    #img_losange_camileia{
        width: 4%;
        margin-left: 2%;
        vertical-align: middle;

    }

    #logo_camileia{
        width: 49%;
        margin-top: 130px;
        margin-left: 15px;
        }

    #image_scroll{
        display: none;
    }

    .animation{
        top: 0;
        overflow: hidden;
        z-index: 1;
    }

    #video_animation{        
        margin-top: 70px;
        width: 100%;
    }

    #presentation{
         position: absolute;
     }

    #nompage{
        margin-left: 30px;
        margin-top: 140px;
        position: absolute;
    }

    #transparent{
        margin-top: 630px;
        margin-right: auto;
        margin-left: auto;
        background: rgba(255, 255,255, 0.75) none repeat scroll 0 0;
    }

    .text_presentation_camileia{
        background: black;
        color: white;
        padding: 40px 94px;
        margin-left: -85px;
        font-size: 17px;
    }

    #mention_légale{
        display: inherit;
    }

    .titre_div{
        vertical-align: middle;
        color: #7bcac7;
        font-size: 4vw;
    }

    .align_image {
        height: 77px;
        vertical-align: middle;
        padding: 10px;
    }

    #image1_align{
        margin-left: 155px;
    }

    #graphique_reporting_decisionnel{
        width: 424px;
        margin-top: 31px;
        margin-left: 30px;
    }

    section.edito {
        margin: 0;
        padding: 40px 35px;
    }

    #logo_camileia_entete{
        margin-top: -21%;
        z-index: 1;
        margin-left: 18%;
        position: absolute;
        width: 62%
    }

    .p1{
        width: 100%
    }

    .p2{
        width: 100%
    }

    #video_seji{
        width: 70%;
        margin: 0px 15%;
        float: none;
    }


    .ul1{
        width: 100%;
        float: none;
    }

    .ul2{
        width: 100%;
        float: none;
    }

    .separateur{
        padding: 0;
    }   

    .titreEntete {
        margin-bottom: -80px;
    }

    #pointsForts {
        padding: 3% 0px 0 25px;
        width: 100%;
    }

    #graphVert{
        width: 70%;
        float: none;
    }

    .slideshow input:checked + label img {
        -webkit-transform: translate(-30px) scale(1.7);
        -moz-transform: translate(-30px) scale(1.7);
        -o-transform: translate(-30px) scale(1.7);
        transform: translate(-30px) scale(1.7);
        cursor: zoom-out;
    }

    .slideshow2 input:checked + label img {
        -webkit-transform: scale(2.4);
        -moz-transform: scale(2.4);
        -o-transform: scale(2.4);
        transform: scale(2.4);
        cursor: zoom-out;
    }

    .slideshow2 {
        width: 56%;
    }

    #synthese table {
        width: 90%;
    }

    #formulaireContact{
        margin-top: 10%;
    }

    .modal {
        width: 100%;
        margin-left: -50%;
        left: 50%;
    }

    .modal-body {
        padding: 15px;
    }

    #listPointsForts, #listSeji, #listMilae, #listUtsy {
        padding-left: 15px;
    }

    section.partenaires img{
        height: 80px;    
        margin: 20px;
    }

    .ML {
        font-size: 66px !important;
    }

    #contentVocations{
        padding: 40px 35px;
    }
    .img_login{
        display: none;
    }
}

/***************************************************************************************************************************************
                                                            MIN 481PX
                                                            MAX 767PX
                                         VERSION SMARTPHONE TAILLE GRAND ECRAN + TABLETTE PORTRAIT
***************************************************************************************************************************************/


@media (max-width: 768px) {

    #mention_légale{
        display: inherit;
    }

    #adresse1{
        position: absolute;
        display: block;
        margin-left: 145px;
        margin-top: 250px;
        text-align: center;
        height: auto;
        font-size: 20px;
    }

    .articleh1{
        font-size: 25px;
    }

    #articleSMS{
        font-size: 52px;
    }

    .ML{
        font-size: 40px !important;
    }

    #articleSMS1{
        padding: 20px 10px 30px;
        width: auto;
        height: auto;
        color: #3d3d3b;
        font-family: Raleway ,Tahoma, Helvetica,sans-serif;
        font-size: 24px;
        font-weight: normal;
    }

    #articleSMS2{
        padding: 20px 10px 30px;
        width: auto;
        height: auto;
        color: #3d3d3b;
        font-family: Raleway ,Tahoma, Helvetica,sans-serif;
        font-size: 3.5VW;
        font-weight: normal;
    }

    .nav > li > a{
        font-size: 79%;
    }

    #header{
        width: 100%;
    }

    .animation{
        display: block;
    }

    .img{
        border: 0;
        float: left;
        height: inherit;
        width: 45%;
        padding-top: 10px;
    }

    .header__icon{
        position: relative;
        display: block;
        float: left;
        width: 17%;
        height: 66px;
        cursor: pointer;
    }

    .header__icon:after {
        content: '';
        position: absolute ;
        display: block;
        width: 1.5rem;
        height: 0;
        top: 20%;
        left: 30%;
        box-shadow: 0 5px 0 1px #7bcac7, 0 13px 0 1px #7bcac7, 0 21px 0 1px #7bcac7, 0 29px 0 1px #7bcac7;
    }

    .text_presentation_camileia{
        background: black;
        color: white;
        padding: 4% 9%;
        margin-right: -4.3%;
        margin-left: -5.5%;
        font-size: 14px;
    }

    #text_krim_bechina{
        font-size: 21px;
        position: absolute;
        margin-left: 9%;
        margin-top: -1%;
        top: 24%;
    }

    #text_sms{
        font-size: 3.5vw;
        position: absolute;
        margin-left: 10%;
        margin-top: -1%;
        top: 24%;
    }

    #text_sms_titre{
        position: absolute;
        margin-left: 9%;
        margin-top: -1%;
        top: 24%;
        font-size: 6vw;
    }

    #corps_presentation{
        font-size: 14px;
        padding-left: 0;
    }
    .krim_bechina{
        background: black;
        float: inherit;
        position: relative;
        margin-right: -4.2%;
        margin-left: -3.8%;
        font-size: 15px;
    }

    #img_losange_camileia{
        width: 4%;
        margin-left: 2%;
        vertical-align: middle;

    }

    #presentation{
         position: absolute;
     }

    #nompage{
        position: absolute;
        margin-top: 100px;
        margin-left: 30px;
    }

    #logo_camileia {
        width: 304px;
        margin-top: 120px;
        margin-left: 8%;
    }

    #transparent{
        margin-top: 400px;
        margin-right: auto;
        margin-left: auto;
        background: rgba(255, 255,255, 0.75) none repeat scroll 0 0;
    }

    .div_presentation_camileia{
        padding-left: 0px;
    }

    .with--sidebar .site-pusher {
        transform: translateX(150px);
    }

    .titre_div{
        vertical-align: middle;
        color: #7bcac7;
        font-size: 4vw;
    }

    #text_image_sig{
        display: block;
    }

    .property_sms_div{
        width: 100%;
    }
    
    
    .align_image{
        display: none;
    }

    #graphique_reporting_decisionnel{
        width: 50%;
    }

    #graphique_reporting_decisionnel{
       display: none;
    }

    #guillemets{
        margin-top: -17%;
        margin-right: 240px;
        width: 47px;
    }

    #synthese table {
        width: 100%;
    }

    .slideshow2 {
        height: 360px;
    }
    .menu ul ul {
        display: none;
    }
    .contenuSeji {
        margin: 0px !important;
    }
    .contenuSeji .img_wrap h3 {
        text-align: center;
        color: white;
        margin-top: -98px;
        position: absolute;
        width: inherit;
        font-size: 20px;
        padding: 0 22px;
        line-height: 23px;
     }
    .contenuSeji .img_img {
        height: 150px;
        filter: brightness(70%);
    }
    .SejiVersion .img_wrap .img_img {
        height: 170px;
        filter: brightness(75%);
    }
    .SejiVersion .img_wrap h3 {
        text-align: center;
        color: white;
        margin-top: -93px;
        position: absolute;
        width: inherit;
        font-size: 26px;
    }

    .contenuUtsy {
        float: left;
        width: 33.3333333333%;
        display: table;
        margin-top: 0px !important;
    }
    .contenuUtsy .img_img {
        height: auto;
        filter: brightness(70%);
    }
    .contenuschemaUTSY{
        float: none;
        width: 100%;
    }
    #schema_utsy{
        height:auto!important;
        padding: 0px!important;
        width: 100% !important;
    }
    .schemaUTSY input:checked + label img {
    -webkit-transform: translate(0px, 0px) scale(1);
    -moz-transform: translate(0px, 0px) scale(1);
    -o-transform: translate(0px, 0px) scale(1);
    transform: translate(0px, 0px) scale(1);
    cursor: zoom-out;
    }
    #text-i-building2{
        margin-top: -70px;
    }
    #vert_1{
        display: none;
    }
    .contenuDouble{
        display: none;
    }
    .img_proteus{
        width: 300px;
        margin: 10px;
    }

    #list_edito{
        margin: 0px;
    }

    #video_seji{
        width: 100%;
        margin: 0px;
    }
}



@media (max-width: 1200px) {
    section.accueil{
        width: 100%;
    }

    section.accueil article{
        clear: both;
    }

    section.accueil #edito{
        width: 29%;
        margin: 10px 2%;
    }

    section.accueil #editoimg {
        width: 67%;
        background: #04172b;
    }

    section.accueil #vocationsimg1 {
        width: 33%;
    }

    section.accueil #vocations {
        width: 30%;
        margin: 2%;
    }

    section.accueil #vocationsimg2 {
        width: 33%;
    }

    section.accueil #solutionsimg {
        width: 67%;
        background: url(../images/article/accueil/img3.png) center no-repeat;
    }

    section.accueil #solutions {
        width: 29%;
        margin: 2%;
    }

    section.accueil h2 {
        font-size: 25px;
    }

    #mentionsLegal table tr {
        display: flex;
        flex-direction: column; 
    }

    #mentionsLegal table tr td{
        margin-bottom: 20px; 
    }

}

@media (max-width: 1350px){
    #image_haut_page{
        display: none;
    }
}

/***************************************************************************************************************************************
                                                            MIN 481PX
                                                            MAX 880PX
***************************************************************************************************************************************/

@media (max-width: 880px) and (min-width: 481px){


    section.accueil #edito p{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 9;
        -webkit-box-orient: vertical;
    }

    section.accueil #edito, section.accueil #vocations, section.accueil #solutions {
        width: 50%;
        padding: 3%;
        margin: 0;
    }

    section.accueil #editoimg {
        width: 50%;
        background: #04172b;
    }

    section.accueil #vocationsimg1 {
        width: 50%;
        background: url(../images/article/accueil/img2.png) right no-repeat;
    }

    section.accueil #vocationsimg2 {
        display: none;
    }

    section.accueil #vocations p{
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 13;
        -webkit-box-orient: vertical;
    }

    section.accueil #solutionsimg {
        width: 50%;
        background: url(../images/article/accueil/img3.png) -150px no-repeat;
        float: right;
    }

        
}

@media (max-width: 910px) {
    #textCitation {
        position: relative; 
        margin-left: 0;
    }

    #textCitationEdito {
        position: relative;
        margin-left: 0;
    }

    #citationKrim{
        display: none;
    }
}

@media (max-width: 790px) {
    .iframe_newsletter{
        height:550px;
    }
}


/***************************************************************************************************************************************
                                                            MIN 0PX
                                                            MAX 480PX
                                              VERSION SMARTPHONE ECRAN TAILLE MOYENNNE
***************************************************************************************************************************************/


@media (max-width: 480px) {

    #mention_légale{
        display: inherit;
    }

    #adresse1{
        position: absolute;
        display: block;
        margin-left: 45px;
        margin-top: 247px;
        text-align: center;
        height: auto;
        font-size: 18px;
    }

    .body{
        background: none;
    }

    .articleh1{
        font-size: 6vw;
    }

    #articleSMS1{
        padding: 20px 10px 30px;
        width: auto;
        height: auto;
        color: #3d3d3b;
        font-family: Raleway ,Tahoma, Helvetica,sans-serif;
        font-size: 21.5px;
        font-weight: normal;
    }

    #articleSMS2{
        padding: 20px 10px 30px;
        width: auto;
        height: auto;
        color: #3d3d3b;
        font-family: Raleway ,Tahoma, Helvetica,sans-serif;
        font-size: 4vw;
        font-weight: normal;
    }

    .nav > li > a{
        font-size: 79%;
    }

    #header{
        width: 100%;
    }

    .img{
        border: 0;
        float: left;
        height: inherit;
        width: 45%;
        padding-top: 10px;
    }

    .header__icon{
        position: relative;
        display: block;
        float: left;
        width: 17%;
        height: 66px;
        cursor: pointer;
    }

    .header__icon:after {
        content: '';
        position: absolute ;
        display: block;
        width: 1.5rem;
        height: 0;
        top: 20%;
        left: 30%;
        box-shadow: 0 5px 0 1px #7bcac7, 0 13px 0 1px #7bcac7, 0 21px 0 1px #7bcac7, 0 29px 0 1px #7bcac7;
    }

    .text_presentation_camileia{
        background: black;
        color: white;
        padding: 4% 9%;
        margin-right: -4.3%;
        margin-left: -5.5%;
        font-size: 14px;
    }

    #text_krim_bechina{
        font-size: 19px;
        position: absolute;
        margin-left: 13%;
        margin-top: -1%;
        top: 14%;
    }

    #text_sms{
        font-size: 4.5vw;
        position: absolute;
        margin-left: 13%;
        margin-top: -2%;
        top: 19%;
    }

    #text_sms_titre{
        position: absolute;
        margin-left: 12%;
        margin-top: -1%;
        top: 30%;
        font-size: 6vw;
    }

    #corps_presentation{
       font-size: 14px;
       padding-left: 0;
    }
    .krim_bechina{
        background: black;
        float: inherit;
        position: relative;
        margin-right: -4.2%;
        margin-left: -3.8%;
        font-size: 15px;
    }

    #img_losange_camileia{
        width: 6%;
        margin-left: 2%;
        vertical-align: middle;

    }

    #nompage{
        position: absolute;
        margin-top: 120px;
        margin-left: 30px;
    }

    #logo_camileia {
        width: 280px;
        margin-top: 120px;
        margin-left: 8%;
    }

    #transparent{
        margin-top: 400px;
        margin-right: auto;
        margin-left: auto;
        background: rgba(255, 255,255, 0.75) none repeat scroll 0 0;
    }

    #div_presentation_camileia{
        padding-left: 0px;
    }

    .with--sidebar .site-pusher {
        -webkit-transform: translateX(150px);
        transform: translateX(150px);
    }

    .nav {
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        -webkit-overflow-scrolling: touch;
        background-color: #000009;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        list-style-type: none;
        z-index: 1;
        height: 100%;
    }

    .titre_div{
        vertical-align: middle;
        color: #7bcac7;
        font-size: 4vw;
    }

    #image_haut_page {
        position: fixed;
        width: 50px;
        bottom: 15px;
        right: 15px;
        opacity: 0.5;
    }

    .titremenu{
        font-size: 15px;
    }

    .lienmenu{
        font-size: 10px;
    }

    #mp-menu{
        width:155px;
    }
    .align_image{
        display: none;
    }

    #graphique_reporting_decisionnel{
        display: none;
    }

    section.accueil #edito, section.accueil #vocations, section.accueil #solutions {
        width: 92%;
        margin: 4%;
    }

    section.accueil #editoimg, section.accueil #vocationsimg1, section.accueil #vocationsimg2, section.accueil #solutionsimg {
        display: none;
    }

    section.accueil #solutions {
        height: 280px;
    }

    section.accueil {
        height: 972px;
        min-height: 972px;
    }

    .separateur {
        display: none;
    }


    #btLire {
        padding: 10px 0 0 0;
    }

    #articleSMS {
        font-size: 25px;
    }
    .slideshow2 {
        height: 200px;
        width: 70%;
    }
    #imgLogoSolutions img {
        margin: 40px 0px;
        width: 100%;
    }
    section.solutions_gris {
        padding: 10px 10px;
        clear: both;
    }
    section.proteus{
        padding: 10px 10px;
        clear: both;
    }
    section.edito {
        margin: 0;
        padding: 75px 10px;
    }
    #pointsForts {
        padding: 0px;
        width: 100%;
    }
    .menu ul ul {
        display: none;
    }
    #synthese table h2 {
        font-size: 22.5px !important;
    }
    #synthese table h3 {
        font-size: 15.5px !important;
    }
    #synthese table h4 {
        font-size: 14.5px !important;
    }
    .contenuSeji .img_wrap h3 {
        text-align: center;
        color: white;
        margin-top: -58px;
        position: absolute;
        width: inherit;
        font-size: 15px;
        padding: 0 22px;
        line-height: 15px;
    }
    .contenuSeji {
        float: left;
        width: 50%;
        display: table;
        margin: 0px !important;
    }

    .contenuSeji .img_img {
        height: auto;
        filter: brightness(70%);
    }
    .SejiVersion {
        float: left;
        width: 50%;
    }
    .SejiVersion .img_wrap .img_img {
        height: auto;
        filter: brightness(75%);
    }
    .SejiVersion .img_wrap h3 {
        text-align: center;
        color: white;
        margin-top: -80px;
        position: absolute;
        width: inherit;
        font-size: 27px;
    }
    #download {
        margin: auto;
        width: 285px;
        display: block;
        margin-bottom: 30px;
        margin-top: 30px;
    }
    #contentVersionSeji {
        height: 380px;
    }
    section.milae {
        margin: 10px;
    }
    .MILAEmod {
    width: 100%;
    margin: 0px;
    float: none;
    height: 155px;
    text-align: center;
    margin-top: 10px;
    }
    #i-building2{
        height: 60px;
    }
    #text-i-building2{
        margin-top: -40px;
    }
    #schema_utsy{
        height: auto !important;
	padding-top: 0px !important;
    }
    #contenuUtsy {
    height: 500px;
	}
	.schemaUTSY input:checked + label img {
    -webkit-transform: translate(-100px, -30px) scale(2);
    -moz-transform: translate(-100px, -30px) scale(2);
    -o-transform: translate(-100px, -30px) scale(2);
    transform: translate(-100px, -30px) scale(2);
    cursor: zoom-out;
    }

    #map {
        width: 100%;
        height: 410px;
    }
    #adresseCamileia {
        margin-top: -112px;
        position: absolute;
        margin-left: 50%;
        left: -162px;
    }
    #adresse {
        width: 320px;
    }
    .ML{
        font-size: 25px !important;
    }
    #vert_1{
        display: none;
    }
    .contenuDouble{
        display: none;
    }

    .img_miniature_news{
        width: 100% !important;
        height: auto !important;
    }

    .iframe_newsletter{
        height: 600px;
    }
}