body {
    background-image: url(assets/bg.png) ;
    margin:0px;
    display: block!important;
    height:100%;
    width: 100%;
    color:#fff;
    font-family: 'Roboto', sans-serif;
	opacity: 0;
	transition: opacity 1s;
}
.logo img{
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}
.about-cta {
    position: fixed;
    left: 16%;
    top: 50%;
    transform: translate(-50%, -50%);                                
}
.contact-cta {
    position: fixed;
    left: 84%;
    top: 50%;
    transform: translate(-50%, -50%);                            
}
.email-cta {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);                            
}
.email-cta a.cta {
    font-size:16px;                            
}
a.cta {
    color:#737373;
    text-decoration:none;
    font-size:35px;
}

body.about .logo img{
    position: fixed;
    left: 89%;
    top: 78%;
    transform: translate(-50%, -50%);
    width: 100%;
}

body.contact .logo img{
    position: fixed;
    left: 11%;
    top: 21%;
    transform: translate(-50%, -50%);
    width: 100%;
}

body.about .text {
    position: fixed;
    left: 35%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 45%;
    font-size: 20px;
    color: #737373;
}

/** EFFECT **/
.effect {
    font-size: 21px;
    animation: fadein 2s;
    -moz-animation: fadein 2s; /* Firefox */
    -webkit-animation: fadein 2s; /* Safari and Chrome */
    -o-animation: fadein 2s; /* Opera */
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}