body {
    font-family: 'Roboto', sans-serif;
    background-image: url('/static/images/01.jpg');
    background-size: 100% 100%;
    background-attachment: fixed;
    margin: 0px;
}



/* <1440 */
@media (max-width: 1439px) {
    body {
        background: linear-gradient(to bottom, #C6CED6, #EEF0EF);
    background-attachment: fixed;
    margin: 0;
    height: 90vh;
    }
    
    
}

/* Transition Timings */
.transLight {
    transition: all 0.15s ease;
}

.trans {
    transition: all 0.25s ease;
}

.transLong {
    transition: all 0.5s ease;
}

/* Local fonts */
@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-Black.ttf') format('truetype');
    font-weight: 900; /* Black */
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-BlackItalic.ttf') format('truetype');
    font-weight: 900; /* Black */
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-BoldCondensed.ttf') format('truetype');
    font-weight: bold;
    font-style: condensed;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-BoldCondensedItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic condensed;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-BoldItalic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-Condensed.ttf') format('truetype');
    font-weight: normal;
    font-style: condensed;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-CondensedItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic condensed;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-Light.ttf') format('truetype');
    font-weight: 300; /* Light */
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-LightItalic.ttf') format('truetype');
    font-weight: 300; /* Light */
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-Medium.ttf') format('truetype');
    font-weight: 500; /* Medium */
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-MediumItalic.ttf') format('truetype');
    font-weight: 500; /* Medium */
    font-style: italic;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-Thin.ttf') format('truetype');
    font-weight: 100; /* Thin */
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('../font/roboto/Roboto-ThinItalic.ttf') format('truetype');
    font-weight: 100; /* Thin */
    font-style: italic;
}