.main-navigation{
    transform : translate(100%, 0%) matrix(1, 0, 0, 1, 0, 0);
    transition : all .7s ease-in-out;
}
.navigation-visible .main-navigation{
    transform : matrix(1, 0, 0, 1, 0, 0);
    transition : all .7s ease-in-out;
}
.navigation-visible .container-small nav ul li {
    transition: transform 1s;
    transform: translateY(145px);
    transform: translateX(0);
}
.navigation-visible .container-small nav ul li:first-child {
    transition-delay: 200ms;
}
.navigation-visible .container-small nav ul li:nth-child(2) {
    transition-delay: 400ms;
}
.navigation-visible .container-small nav ul li:nth-child(3) {
    transition-delay: 600ms;
}
.navigation-visible .container-small nav ul li:nth-child(4) {
    transition-delay: 800ms;
}
.container-small nav ul li {
    transition: transform 1s;
    transform: translateY(-145px);
    transition-delay: 0ms;
}
.map-icon {
    opacity: 0;
}
.navigation-visible .map-icon {
    opacity: 1;
    transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -webkit-transition: opacity 1s ease-in-out;
    transition-delay: 300ms;
}
.social a {
    opacity: 0;
    transform: matrix(1, 0, 0, 1, 0, 80);
}
.navigation-visible .social a.instagram{
    visibility: visible;
    opacity: 1;
    transition: opacity 2s ease-in;
    -moz-transition: opacity 2s ease-in;
    -webkit-transition: opacity 2s ease-in;
    transform: matrix(1, 0, 0, 1, 0, 0);
    transition-delay: 400ms;
}
.navigation-visible .social a.facebook, .navigation-visible .social a.linkedin, .navigation-visible .social a.twitter{
    visibility: visible;
    opacity: 1;
    transition: opacity 2s ease-in;
    -moz-transition: opacity 2s ease-in;
    -webkit-transition: opacity 2s ease-in;
    transform: matrix(1, 0, 0, 1, 0, 0);
    transition-delay: 400ms;
}
.social__w3 .social a {
    opacity: 0;
    transform: matrix(1, 0, 0, 1, 0, 80);
}
.social__w3 .social a.instagram{
    visibility: visible;
    opacity: 1;
    transition: opacity 2s ease-in;
    -moz-transition: opacity 2s ease-in;
    -webkit-transition: opacity 2s ease-in;
    transform: matrix(1, 0, 0, 1, 0, 0);
    transition-delay: 400ms;
}
.social__w3 .social a.facebook, .social__w3 .social a.linkedin, .social__w3 .social a.twitter{
    visibility: visible;
    opacity: 1;
    transition: opacity 2s ease-in;
    -moz-transition: opacity 2s ease-in;
    -webkit-transition: opacity 2s ease-in;
    transform: matrix(1, 0, 0, 1, 0, 0);
    transition-delay: 400ms;
}

.hide_w3 {
    opacity: 0;
}
.landing-wrapper{
    height: 900px;
}

@media screen and (max-width: 1100px) {
    .launch{
        transform: matrix(.69465837, -.7193398, .7193398, .69465837, 150, -226) rotate(-10deg);
    }
}
@media screen and (max-width: 768px) {
    .launch{
        transform: matrix(.69465837, -.7193398, .7193398, .69465837, 70, -226) rotate(-10deg);
    }
}
@media screen and (max-width: 500px) {
    .launch{
        transform: matrix(.69465837, -.7193398, .7193398, .69465837, 57, -146) rotate(-10deg);}
}
#rocket {
    animation: rocket-rotate 20s linear reverse infinite;
}
@keyframes rocket-rotate {
    0%, 20% {
        transform: rotate(85deg);
    }
    50% {
        transform: rotate(30deg);
    }
    80%, 100% {
        transform: rotate(-25deg);
    }
}
.start-project-block:hover .launch1{
    animation: rocket-rotate 20s linear reverse infinite;
    position: relative;
}
@-webkit-keyframes flipLoop {
    0%, 20% {
        -webkit-transform: rotateY(0deg);
    }
    30%, 70% {
        -webkit-transform: rotateY(180deg);
    }
    80%, 100% {
        -webkit-transform: rotateY(360deg);
    }
}
#logo-loading {
    width: 25%;
    max-width: 200px;
    margin: 0;
    -webkit-transition: -webkit-transform;
    -webkit-transform-style: preserve-3d;
    -webkit-animation: flipLoop;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 3s;
}
.copyright a {
    color: #b1ada5;
}