/* FONTS */
@font-face { font-family: 'nevis-Bold'; src: url('../webfont/nevis-Bold.eot?#iefix') format('embedded-opentype'), url('../webfont/nevis-Bold.woff') format('woff'), url('../webfont/nevis-Bold.ttf') format('truetype'), url('../webfont/nevis-Bold.svg#nevis-Bold') format('svg'); font-weight: normal; font-style: normal; }

/* FONTS */
/* #024278 */

body{width: 100%; padding: 0; margin: 0; background-color: #024278;}

section{width: 100%;}

a{color: #FFFFFF; text-decoration: none; opacity: 0.75; transition: all 0.3s ease 0s;}
a:hover{opacity: 1;}

.spacescene{background: radial-gradient(ellipse at center -60px , #024278 25%, #001e30 100%) no-repeat fixed center top rgba(0, 0, 0, 0); -webkit-radial-gradient(ellipse at center -60px , #024278 25%, #001e30 100%) no-repeat fixed center top rgba(0, 0, 0, 0); -moz-radial-gradient(ellipse at center -60px , #024278 25%, #001e30 100%) no-repeat fixed center top rgba(0, 0, 0, 0); width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 50;}
.sitespace{position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 100; overflow: hidden;}

.galaxy{position: absolute; top: 0; left: 0; width: 100%; z-index: 300; padding: 50px 0 10px; text-align: center; font-family: 'Lato', sans-serif; text-transform: uppercase; letter-spacing: 2px; font-size: 12px; background: url(../images/galaxy.svg) no-repeat center top 12px transparent; background-size: auto 30px; text-shadow:0 1px 10px #024278;}

.stars{width: 100%; height: 100%; background: url("../images/stars.png") repeat scroll center center rgba(0, 0, 0, 0) ; position: relative;}
.center{position:absolute; background: url("../images/center.svg") no-repeat scroll center center / auto 90% rgba(0, 0, 0, 0); height: 100%; margin: 0 auto; width: 100%;}

.zoneagence{background-color: #001e30; opacity: 0.9; height: 1000px; width: 400px; padding-left: 550px; padding-right: 50px; position: absolute; display: table; top: 50%; z-index: 3000; transform: rotate(-45deg); transition: all 0.3s ease 0s; margin: -500px 0 0 -330px; left: -760px;}
.zoneagence .btn-zoneagence{background: url("../images/mail.svg") no-repeat scroll 0 0 / 100% 100% rgba(0, 0, 0, 0); position: absolute; bottom: 19px; right: 22px; width: 45px; height: 70px; transform: rotate(45deg); opacity: 0.5;}
.zoneagence:hover{transform: rotate(0); margin: -500px 0 0 260px;}
.zoneagence:hover .btn-zoneagence{display: none;}
.zoneagence .content-zoneagence{opacity: 0; transition: all 0.3s ease 0s; display: table-cell; vertical-align: middle; font-family: 'Lato', sans-serif; color: #FFFFFF;}
.zoneagence:hover .content-zoneagence{opacity: 1;}
.zoneagence .content-zoneagence p {font-size: 16px; line-height: 22px; margin: 5px 0;}
.zoneagence .content-zoneagence ul{margin: 5px 0;}
.zoneagence h3.contact-us{margin-bottom: 8px;}
.zoneagence .dashed-underline{ border-bottom: 1px dashed rgba(255,255,255,0.5); padding-bottom: 20px; }

.zoneagence .principal-title{ margin-bottom: 20px; }
.zoneagence .principal-title .left-comete{ display: inline-block; width: 12%; height: 48px; float: left; background: url(../images/little-logo.png) no-repeat center bottom / contain; min-width: 28px; }
.zoneagence .principal-title .titles-container{ display: inline-block; }
.zoneagence .principal-title .titles-container::after{ content: ''; display: inline; clear: both; }
.zoneagence .principal-title .titles-container h2{ font-family: 'nevis-bold', sans-serif; margin: 0; letter-spacing: 1px; text-transform: uppercase; }
.zoneagence .principal-title .titles-container h3{ margin: 0; letter-spacing: 1px;}

.zoneagence ul.contact{list-style: none; padding-left: 20px; font-size: 16px;}
.zoneagence .contact li{margin: 5px 0;}
.zoneagence .contact li.anadore-adress::before {content:""; display: inline-block; width: 12px; height: 22px; background: url(../images/adresse.svg) no-repeat center center / 100% transparent; margin: 0 8px -5px -4px;}
.zoneagence .contact li.anadore-phone-number::before {content:""; display: inline-block; width: 18px; height: 22px; background: url(../images/phone.svg) no-repeat center center; margin: 0 8px -5px -4px;}
.zoneagence .contact li.anadore-mail::before{content:""; display: inline-block; width: 25px; height: 25px; background: url(../images/mail-envelope-closed.svg) no-repeat center center; margin: 0 8px -7px -4px; }

/*
.zoneagence form#call-me-maybe{ display: inline-block; width: 100%; margin-top: 10px; }
.zoneagence form#call-me-maybe input[type="tel"]::-webkit-input-placeholder{ color: #FFF; }
.zoneagence form#call-me-maybe input[type="tel"]::-moz-placeholder{ color: #FFF; }
.zoneagence form#call-me-maybe input[type="tel"]:-moz-placeholder{ color: #FFF; }
.zoneagence form#call-me-maybe input[type="tel"]:-ms-input-placeholder{ color: #FFF; }
.zoneagence form#call-me-maybe input#callback{ width: 73%; padding-left: 12%; background: transparent url('../images/phone_forwarded.svg') no-repeat left center; height: 24px; border: 0; border-bottom: 1px solid #FFF; font-size: 14px; font-family: 'Lato'; color:#FFF; opacity: 0.5; transition: all 0.3s ease; }
.zoneagence form#call-me-maybe input#callback:focus, form#call-me-maybe input#callback:hover{ opacity: 1; }
.zoneagence form#call-me-maybe input[type="submit"]{ width: 15%; background-color: transparent; border: 1px solid #FFF; margin-left: -5px; color: #FFF; padding: 6px; opacity: 0.5; transition: opacity 0.3s; }
.zoneagence form#call-me-maybe input[type="submit"]:hover{ cursor: pointer; background-color: #FFF; color: #024278; opacity: 1; }

.zoneagence form input:focus, .zoneagence .content-zoneagence form textarea:focus{ outline: none; }
.zoneagence form#send-a-message { text-align: center; margin: 10px 0 0;}
.zoneagence form#send-a-message input[type="text"]{ width: 88%; height: 24px; margin-bottom: 10px; padding-left: 12%; background-color: transparent; color: #FFF; font-size: 14px; border: 0; border-bottom: 1px solid #FFF; opacity: 0.4; transition: opacity 0.3s; }
.zoneagence form#send-a-message input[type="text"]:focus, .zoneagence .content-zoneagence form input[type="text"]:hover{ opacity: 1!important; }
.zoneagence form#send-a-message input[type="text"]::-webkit-input-placeholder{ color: #FFF; }
.zoneagence form#send-a-message input[type="text"]::-moz-placeholder{ color: #FFF; }
.zoneagence form#send-a-message input[type="text"]:-moz-placeholder{ color: #FFF; }
.zoneagence form#send-a-message input[type="text"]:-ms-input-placeholder{ color: #FFF; }
.zoneagence form#send-a-message input[type="submit"]{ width: 30%; height: 30px; font-size: 14px; color: #FFF; background-color: transparent; border: 1px solid #FFF; margin-top: 20px; opacity: 0.5; transition: all 0.3s; }
.zoneagence form#send-a-message input[type="submit"]:hover{ background-color: #FFF; color: #024278; opacity: 1; cursor: pointer; }
.zoneagence form#send-a-message input#contact-user{ background: transparent url('../images/space.svg') no-repeat left center; }
.zoneagence form#send-a-message input#contact-mail{ background: transparent url('../images/email.svg') no-repeat left center; margin-bottom: 20px; }
.zoneagence form#send-a-message input#contact-message-txt{ background: transparent url('../images/mail-envelope-closed.svg') no-repeat left center; }
.zoneagence form#send-a-message textarea#contact-message-txt{ width: 94%; padding: 3%; font-size: 14px; font-family: 'Lato', sans-serif; resize: none; height: 100px; max-height: 200px; opacity: 0.5; transition: opacity 0.3s; }
.zoneagence form#send-a-message textarea#contact-message-txt:focus, .zoneagence .content-zoneagence form textarea#contact-message-txt:hover{ opacity: 1!important; }
*/

.section{height: 100vh;}
.section-intro{}
.section .scrollTo {position: absolute; bottom: 50px; left: 50%; margin-left: -30px;}

.section-txt{position: relative; max-width: 600px; width: 100%; color: #FFFFFF; margin: 0 auto;}
.section-txt h2{text-align: center; max-width: 600px; font-family: 'nevis-bold', sans-serif; text-transform: uppercase; margin:0; opacity: 0.75;}
    #conception .section-txt h2{font-size: 82px; line-height: 82px;}
    #design .section-txt h2{font-size: 148px; line-height: 140px;}
    #developpement .section-txt h2{font-size: 60px; line-height: 70px;}
    #photographie .section-txt h2{font-size: 68px; line-height: 70px;}
    #equipe .section-txt h2{font-size: 66px; line-height: 68px;}
    #findus .section-txt h2{font-size: 58px; line-height: 68px;}

.section-txt h3,
.section-txt p.subtitle{text-align: center; position: relative; font-family: 'nevis-bold', sans-serif; font-size: 22px; text-transform: uppercase; letter-spacing:2px; margin:4px auto 0; display: block; overflow: hidden; border-bottom: 1px solid rgba(255,255,255,0.3); padding-bottom: 20px; margin-bottom: 20px;}
    #findus p.subtitle{border: none; padding-bottom: 0;}
.section-txt p{text-align: justify; font-family: 'Lato', sans-serif; font-size: 18px; letter-spacing:1px; line-height: 28px;}
.section-txt ul{border-top: 1px solid rgba(255,255,255,0.3); margin-top: 25px; padding: 10px 0 0; text-align: center;}
    .section-txt ul.social{border-top: 0 none; padding: 0; text-align: center; max-width: 400px; width: 100%; margin: 20px auto 0; display: block;}
.section-txt ul li{display: inline-block; position: relative; width: 20%; min-height: 35px; border: 1px solid rgba(255,255,255,0.3); margin: 2% 2% 0;}
    #equipe .section-txt ul li{display: inline-block; line-height: 0; width: 20%; border: 1px solid rgba(255,255,255,0.3); margin: 2% 2% 0; border-radius: 100%; overflow: hidden;}
    #equipe .section-txt ul li img{width: 100%;}
    #equipe .section-txt ul li span{position: absolute; top: -150%; margin-top: -12px; line-height: 1em; vertical-align: middle; width: 100%; height: 100%; display: block; text-align: center; font-family: 'Lato', sans-serif; font-size: 12px; letter-spacing:2px; text-transform: uppercase; z-index: 1; transition: all 0.2s ease 0s;}
    #equipe .section-txt ul li:hover span{top: 50%;}
    #equipe .section-txt ul li span:before{background-color: rgba(2,66,120,0.9); content: ""; position: absolute; top: -50%; margin-top: 12px; display: block; width: 100%; height: 100%; z-index: -1;}

    #findus .section-txt ul.social li{font-size: 12px; width: 27.33%; margin: 0 3%; min-width: auto; min-height: auto; border: 0 none; display: block; float: left;}
    #findus .section-txt ul.social li img{width: 100%; margin-bottom: 10px;}
    #findus .section-txt ul li a{display: block; text-align: center; font-family: 'Lato', sans-serif; font-size: 12px; letter-spacing:2px; text-transform: uppercase;}
    #findus .section-txt ul.sidesprojects{max-width: 260px; width: 80%; margin: 20px auto 0; padding-top: 25px;}
    #findus .section-txt ul.sidesprojects li{font-size: 12px; width: 44%; margin: 0 3%; min-width: auto; min-height: auto; border: 0 none; display: block; float: left;}
    #findus .section-txt ul.sidesprojects li img{width: 100%; height: auto; margin-bottom: 10px;}
    #findus .section-txt ul.social:after,
    #findus .section-txt ul.sidesprojects:after{content: ""; display: block; clear: both;}

.section-txt ul.texte-ref {position: relative; min-width: auto; min-height: auto; border-top: 1px solid rgba(255,255,255,0.3); margin: 15px 0 0; font-family: 'Lato', sans-serif; letter-spacing:3px;}
.section-txt ul.texte-ref li{display: inline-block; width: auto; position: relative; min-width: auto; min-height: auto; border: 0 none; margin: 2% 3% 0; font-size: 18px; font-weight: 700; text-transform: uppercase;}
.section-txt ul.technos li{border: 0 none; position: relative; width: 15%;}
.section-txt ul.technos li img{width: 100%; margin-bottom: 5px; -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.75; transition: all 0.2s ease 0s;}
.section-txt ul.technos li img:hover{-webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1;}
.section-txt ul.technos li span {display: block; text-align: center; font-family: 'Lato', sans-serif; font-size: 12px; letter-spacing:2px; text-transform: uppercase;}

.comete{width: 300px; height: 300px; background: url(../images/FormationComete.png) no-repeat transparent; margin: -130px auto 0; position: relative;}
.comete img{opacity: 0; display: block;}

.anadorelogo{background: url("../images/anadorelogo.svg") no-repeat scroll 0 0 / 100% auto rgba(0, 0, 0, 0); max-width: 550px; width: 100%; height: 85px; margin: 0 auto 10px; opacity: 0;}
.tagline{text-align: center; max-width: 565px; width: 100%; margin: 0 auto; height: 30px; font-family: 'nevis-bold', sans-serif; font-size: 27px; text-transform: uppercase; letter-spacing:3px; color: #FFF; overflow: hidden;}
.tagline span{opacity: 0; margin-top: 30px; height: 30px; display: block;}

.illu {display: block; margin: -70px auto 10px;}

.textbloc{width: 100%; height: 100%; position: absolute; top: 0;}
.controltext{font-family: 'Iceland', cursive; font-size: 14px; letter-spacing: 5px; color: #FFFFFF; opacity: 0.3; position: absolute;}
.ctrltxtborder{border: 1px solid #fff; bottom: 30px; font-size: 10px; left: 320px; padding: 2px 0 2px 6px;}
.ctrltxt1{left: 350px; top: 20px; }
.ctrltxt2{right: 390px; top: 60px;}
.ctrltxt3{right: 110px; top: 270px;}
.ctrltxt4 {right: 50px; top: 410px;}
.ctrltxt5{bottom: 40px; right: 320px;}
.ctrltxt6{bottom: 90px; left: 280px;}
.ctrltxt7{bottom: 200px; left: 150px;}
.ctrltxt8 {top: 330px; left: 10px}
.ctrltxt9{left: 180px; top: 140px;}

.control1{width: 300px; height: 30px; background: url("../images/control1.svg") no-repeat scroll 0 0 / 100% 100% rgba(0, 0, 0, 0); position: absolute; bottom: 0; left: 10px; opacity: 0.3;}
.control2{width: 50px; height: 50px; background: url("../images/control2.svg") no-repeat scroll 0 0 / 100% 100% rgba(0, 0, 0, 0); position: absolute; top: 20px; right: 50px; z-index: 3;}
.control3{width: 50px; height: 50px; background: url("../images/control3.svg") no-repeat scroll 0 0 / 100% 100% rgba(0, 0, 0, 0); position: absolute; top: 80px; right: 50px; opacity: 0.6; z-index: 3;}
.control4{width: 30px; height: 240px; background: url("../images/control4.svg") no-repeat scroll 0 0 / 100% 100% rgba(0, 0, 0, 0); position: absolute; top: 0; right: 10px; opacity: 0.5; z-index: 3;}

.spacer{clear: both;}

/*************/
/*ANIMATIONS*/
/***********/


/* ANADORE LOGO */
.anadorelogo{
    animation-name:anadorelogo;
    animation-duration:2s;
    animation-iteration-count:1;
    animation-timing-function:linear;    
    animation-fill-mode:forwards;

    -webkit-nimation-name:anadorelogo;
    -webkit-animation-duration:2s;
    -webkit-animation-iteration-count:1;
    -webkit-animation-timing-function:linear;    
    -webkit-animation-fill-mode:forwards;
}

@keyframes anadorelogo{
    0%{opacity:0;}
    100%{ opacity:1;}
}
@-webkit-keyframes anadorelogo{
    0%{opacity:0;}
    100%{opacity:1;}
}

/* LETTRES */
.tagline span{
    animation-name:letter;
    animation-duration:1s;
    animation-iteration-count:1;
    animation-timing-function:linear;    
    animation-fill-mode:forwards;

    -webkit-nimation-name:letter;
    -webkit-animation-duration:1s;
    -webkit-animation-iteration-count:1;
    -webkit-animation-timing-function:linear;    
    -webkit-animation-fill-mode:forwards;
}

@keyframes letter{
    from{opacity:0; margin-top: 50px; }
    to{ opacity:0.5; margin-top: 0;}
}
@-webkit-keyframes letter{
    from{opacity:0; margin-top: 50px; }
    to{ opacity:0.5; margin-top: 0;}
}

/*STARS*/

@-moz-keyframes stars {
    0% { background-position: 0 0; }
    100% { background-position: 0 990px; }
}
@-webkit-keyframes stars {
    0% { background-position: 0 0; }
    100% { background-position: 0 990px; }
}
@keyframes stars {
    0% { background-position: 0 0; }
    100% { background-position: 0 990px; }
}

.stars{
    -webkit-animation-name: stars;
    -webkit-animation-duration: 130s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;

    animation-name: stars;
    animation-duration: 130s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

/*ROTATION RADAR*/

@-moz-keyframes rotation {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); }
}

@-webkit-keyframes rotation {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}

@keyframes rotation {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
}

.rotation{
    -webkit-animation-name: rotation;
    -webkit-animation-duration: 35000ms;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;

    animation-name: rotation;
    animation-duration: 35000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;

    -o-transition: rotate(3600deg);
}

/*LOGO COMÈTE*/

.comete{
    animation-name: comete;
    animation-duration: 1.2s;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
    animation-timing-function: steps(25);
    animation-delay: 1s;

    -webkit-animation-name: comete;
    -webkit-animation-duration: 1.2s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: steps(25);
    -webkit-animation-delay: 1s;
}

@-webkit-keyframes comete {
    100% {background-position: -7500px;}
}

@keyframes comete {
    100% {background-position: -7500px;}
}

.comete img{
    animation-name: cometeimg;
    animation-delay: 2.1s;
    animation-duration: .1s;
    animation-fill-mode: forwards;
    animation-iteration-count: 1;

    -webkit-animation-name: cometeimg;
    -webkit-animation-delay: 2.1s;
    -webkit-animation-duration:  .1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
}

@-webkit-keyframes cometeimg {
    100% {opacity: 1;}
}

@keyframes cometeimg {
    100% {opacity: 1;}
}

/*ARROW ANNIM*/

@-webkit-keyframes arrowAnim {
    from {opacity: 0; bottom: 200px;}
    to {opacity: 1; bottom: 50px;}
}

@keyframes arrowAnim {
    from {opacity: 0; bottom: 200px;}
    to {opacity: 1; bottom: 50px;}
}

.arrowAnim{
    -webkit-animation-name: arrowAnim;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: 2;

    animation-name: arrowAnim;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-iteration-count: 2;
}

/*************/
/*RESPONSIVE*/
/***********/

@media screen and (max-width: 1200px) and (max-height: 1200px) {
    body .illu {margin: 0 auto 10px;}
    body .scrollTo {left: 5%!important;}
}

@media screen and (max-width: 1200px) and (max-height: 728px) {
    .section-txt ul.technos li {width: 12%;}
}

@media (max-height: 728px) {
    .illu {display: none !important;}
    .section-txt h2 {font-size: 40px !important; line-height: 50px !important;}
    .section-txt h3,
    .section-txt p.subtitle {font-size: 16px;}
    .section-txt p {font-size: 16px; line-height: 20px;}
}

/*************/

@media screen and (max-height: 1280px) and (max-width: 1200px;) {
    .center{background: url("../images/center.svg") no-repeat scroll center center / 100% auto rgba(0, 0, 0, 0);}
    body .scrollTo {left: 5%!important;}
}

@media screen and (max-height: 650px){
    .content-zoneagence .dashed-underline { padding-bottom: 10px; }
    .content-zoneagence .dashed-aboveline { padding-top: 10px; }
    .content-zoneagence .principal-title{ margin-bottom: 10px; }
    .content-zoneagence .titles-container h2{ font-size: 1.2em }
    .content-zoneagence h3{ font-size: 1em; }
    .content-zoneagence .left-comete{ display: none; }
}
@media screen and (max-height: 740px){
    .content-zoneagence p.anadore-phone-number, .content-zoneagence p.anadore-mail { width: 100%; text-align: center; }
    form#send-a-message textarea#contact-message-txt{ height: 50px; }
}

@media screen and (max-width: 1400px){
    .content-zoneagence p{font-size: 14px;}
    .content-zoneagence p.anadore-phone-number, .content-zoneagence p.anadore-mail { font-size: 14px;}
    .content-zoneagence p.anadore-phone-number::before { width: 16px; height: 20px; margin: 0 4px -5px -4px;}
    .content-zoneagence p.anadore-mail::before{width: 22px; height: 22px;  margin: 0 4px -7px -4px; }
}

@media screen and (max-width: 1300px) {
    .ctrltxtborder{display: none;}
}

@media screen and (max-width: 1140px) {

    .sphere{display: none;}
    .description p{font-size: 16px; line-height: 24px;}
    .description .middle{line-height: 16px;}
    .description span{font-size:22px;}
    .description .left{margin-left: 20px;}
    .description .right{margin-right: 20px;}
    .control2,
    .control3,
    .control4,
    .textbloc {display: none;}

    @-webkit-keyframes cometeintro {
        0% {display: block; -webkit-background-size:200%;}
        98% {display: block; opacity: 1;}
        99% {opacity: 0; -webkit-background-size:4000%;}
        100% {top:-10000px;}
    }

    @keyframes cometeintro {
        from{background-size:200% auto;}
        to{background-size:4000% auto;}

        0% {display: block; top: 0; left: 0;}
        98% {display: block; opacity: 1;}
        99% {opacity: 0; top: 0; left: 0;}
        100% {top:-10000px;}
    }

}


@media screen and (max-width: 999px) {

    header #menu-menu a:hover{background: none ; color: #FFFFFF;}
    .killerzone{margin: 0 auto;}
    .center{width: 100%;}
    .center2{width: 100%;}
    .ctrltxtborder,
    .control1,
    #equipe .section-txt ul li span{display: none;}
    .tagline {overflow: visible;}

    .zoneagence{background-color: #001e30; opacity: 0.9; height: auto; width: 400px;

    @-webkit-keyframes cometeintro {
        0% {display: block; -webkit-background-size:300%;}
        98% {display: block; opacity: 1;}
        99% {opacity: 0; -webkit-background-size:4000%;}
        100% {top:-10000px;}
    }

    @keyframes cometeintro {
        from{background-size:300% auto;}
        to{background-size:4000% auto;}

        0% {display: block; top: 0; left: 0;}
        98% {display: block; opacity: 1;}
        99% {opacity: 0; top: 0; left: 0;}
        100% {top:-10000px;}
    }

}

@media screen and (max-width: 768px) {
    .stars{animation-play-state: paused !important; -webkit-animation-play-state: paused !important;}

    #fp-nav.right:before {width: 60px; height: 180px; transform: rotate(0deg); margin: -5px 0 0 -10px;}
    .fp-section.fp-table,
    .fp-slide.fp-table {padding: 0 15%;}

    .zoneagence {height: 100vh; width: 90vw; padding-left: 0; padding-right: 0; top: 0; transform: rotate(0); margin: 0; left: -90vw;}
    .zoneagence::after {content: "contact";position: fixed;display: block;width: 80px;transform: rotate(-90deg);font-family: lato;color: #FFF;letter-spacing: 3px;text-transform: uppercase;font-size: 12px;height: 20px;opacity: 0.75;background-color: #001e30;padding: 14px 12px;text-align: center;line-height: 12px;top: 50%;margin-top: -24px; right: -70px;}
    .zoneagence:hover{margin: 0; left: 0vw;}
    .content-zoneagence{padding: 20px;}

    .anadorelogo {height: 80px;}

    .description {position: relative; top: auto;}
    .description p.left, .description p.middle, .description p.right{float: none; margin:0 auto 30px; width: 100%; display: block; text-align: center;}

    #fp-nav,
    .spaceshipsbloc,
    .radarbloc,
    .scrollTo,
    .textbloc{display: none !important;}

    #equipe .section-txt ul li {width: 25%;}

    .section-txt h2{font-size: 26px !important; line-height: 30px!important; letter-spacing: 2px;}
    .section-txt h3,
    .section-txt p.subtitle{font-size: 17px; letter-spacing: 1px; padding-bottom: 15px; margin-bottom: 15px;}
    .section-txt p {font-size: 16px; letter-spacing: 0px; line-height: 20px;}
    .section-txt ul {margin-top: 15px;}
    .section-txt ul.texte-ref{letter-spacing: 1px;}
    .section-txt ul.texte-ref li{margin: 1% 1% 0; font-size: 16px;}
    .section-txt ul.technos li span {font-size: 10px; letter-spacing: 0px;}

    @-webkit-keyframes cometeintro {
        0% {display: block; -webkit-background-size:400%;}
        98% {display: block; opacity: 1;}
        99% {opacity: 0; -webkit-background-size:4000%;}
        100% {top:-10000px;}
    }

    @keyframes cometeintro {
        from{background-size:400% auto;}
        to{background-size:4000% auto;}

        0% {display: block; top: 0; left: 0;}
        98% {display: block; opacity: 1;}
        99% {opacity: 0; top: 0; left: 0;}
        100% {top:-10000px;}
    }

}

@media screen and (max-width: 650px) {

    .anadorelogo{height: 70px;}
    .section-txt h3 {display: none;}
    .section-txt h2 {font-size: 24px !important; line-height: 30px !important; letter-spacing: 0;}
    .section-txt ul.texte-ref li {font-size: 14px;}
    .comete {margin: -120px auto 0; -webkit-animation-play-state: paused; animation-play-state: paused; width: 100%; height: auto;}
    .comete img{width: 100%; -webkit-animation-delay: 0s; animation-delay: 0s;}
    .content-zoneagence .left-comete,
    .content-zoneagence p,
    .galaxy{display: none !important;}
}

@media screen and (max-width: 480px) {

    .anadorelogo{height: 50px;}
    .tagline {font-size: 20px; letter-spacing: 2px;}
    .section-txt ul.technos li span{display: none;}
    .illu {display: none;}

    .zoneagence::after {letter-spacing: 2px; font-size: 11px; height: 16px; padding: 14px 8px 6px; line-height: 7px; top: 40px; margin-top: 0; right: -65px;}

    .fp-section.fp-table,
    .fp-slide.fp-table {padding: 0 10%;}

    @-webkit-keyframes cometeintro {
        0% {display: block; -webkit-background-size:500%;}
        98% {display: block; opacity: 1;}
        99% {opacity: 0; -webkit-background-size:4000%;}
        100% {top:-10000px;}
    }

    @keyframes cometeintro {
        from{background-size:500% auto;}
        to{background-size:4000% auto;}

        0% {display: block; top: 0; left: 0;}
        98% {display: block; opacity: 1;}
        99% {opacity: 0; top: 0; left: 0;}
        100% {top:-10000px;}
    }
}

/*************/

@media (max-height: 500px) and (orientation:landscape){
    .fp-section.fp-table, .fp-slide.fp-table {padding: 0 12%;}
    .comete,
    .illu,
    .galaxy,
    .section-txt h3,
    .zoneagence .content-zoneagence p,
    .zoneagence .content-zoneagence ul{display: none !important;}
    .zoneagence .content-zoneagence ul.contact{display: inline !important;}
    .section-txt ul.technos li img{display: none;}
    .section-txt h2 {font-size: 40px !important; line-height: 50px !important;}
    .section-txt p.subtitle {font-size: 16px;}
    .section-txt p {font-size: 16px; line-height: 20px;}
    .zoneagence {height: 100%; width: 90%;}
    #equipe .section-txt ul li {width: 15%; margin: 1% 1% 0;}
    .section-txt ul.social {max-width: 260px;}
    #findus .section-txt ul.sidesprojects {max-width: 140px;}
}

/*************/