/*
 * Copyright (c) 2018. by Kevin Kraus
 */
/*font import*/
/*Ubuntu*/
@import url('https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700');
/*Lato*/
@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700');
/*Roboto*/
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,700');
/*general font*/
body {
    font-family: "Roboto";
    font-weight: 300;
    margin-top: 100px;
}
/*header no text under*/
header {
    height: 100px;
}
/* ELEMENTS */
/*navbar*/
/*list*/
ul {
    margin-bottom: 150;
    padding: 0;
    overflow: hidden;
    background: #333333;
    position: fixed;
    top: 0;
    width: 100%;
    float: left;
}
/*list elements*/
li {
    display: inline-block;
    float: left;
    }
/*list elements link*/
li a {
    display: block;
    color: #fff;
    text-align: center;
    padding: 14px 16px;

}
/* action on list elements hover*/
li a:hover {
    background-color: black;
    color: white;
    text-decoration: none;
}
/* CLASSES */
/*navbar elements center*/
.center_navbar {
    width: 20%;
    padding: 10px;
    text-align: center;
}
/*loader*/
.loader {
    border: 16px solid dodgerblue;
    border-top: 16px solid hotpink;
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
}
@keyframes spin {
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(360deg);
    }
}