/*
    main css file

    @author: Matteo Pinto
    @version: 1.0

 */

@font-face {
    font-family: 'DIN';
    src: url('../fonts/DIN.ttf')  format('truetype');
}

body {
    background-color: #0B1E29; //#162238
    font-family: 'Arial';
    margin-top: 100px;
}

p {
    font-size: 16px;
    font-weight: normal;
    color: #324359 !important; //324359
    line-height: 16px;
    font-family: 'Arial';
}


/***** NAVBAR *****/
#navBarButton {
    border: none;
    color: #324359;
}


#main_container {
    margin-top: 160px;
    width: auto;
    height: auto;
    background-color: transparent;
    animation: animate_text 3.5s cubic-bezier(1,.01,1,.27);
}

.navbar-text {
    color: #324359 !important;
}

.WN_navbar {
    background-color: transparent;
    font-size: 12px;
    color: #324359;
}
.WN_navbar a {
    color: #324359 !important;
}
.WN_navbar a:hover {
    color: #ffffff !important;
}


/** SVG **/

#svg_logo
{
    margin-top: 110px;
}


path, rect {
    stroke-dasharray: 1800;
    animation: animate 2.5s cubic-bezier(0,0,1,.99);
}

text {
    stroke-dasharray: 1800;
    animation: animate 2.9s cubic-bezier(1,.01,1,.27);
}

@keyframes animate {
    from {
        opacity: 0;
        stroke-dashoffset: 1800;
    }

    to {
        opacity: 1;
        stroke-dashoffset: 1800;
    }
}

@keyframes animate_text {
    from {
        opacity: 0;
        stroke-dashoffset: 1800;
    }

    to {
        opacity: 1;
        stroke-dashoffset: 1800;
    }
}


/**** MEDIA QUERY ****/
@media only screen and (max-width: 600px) {
    p {
        font-size: 8vw;
    }
}