@font-face {
    font-family: 'abeatbyKai';
    font-style: normal;
    font-weight: normal;
    src: local('abeatbyKai'), url('font.woff') format('woff');
}
div,a,p,text {
    font-family:'abeatbyKai';font-weight:normal;margin:0;
}
input { font-family:monospace; }
input.submit { font-size:32px; color: cornflowerblue; }
div.centre {
    position: absolute;
    top: 50%;
    left:50%;
    transform: translate(-50%,-50%);
}
div.haut {
    position: absolute;
    top: 0%;
    left:30%;
    text-align: center;
    color: grey;
}
div.logo {
    color: cornflowerblue;
    font-size:144px;text-align: center;
}
div.contact {
    color: grey;
    font-size:20px;
    text-align: right;
    position: fixed;
    right: 0;
    bottom: 0;
}
span, div.green { color:yellowgreen; }
span.helv {
    color:cornflowerblue; vertical-align:-10px;font-size:40px;
}
span.rond {
    vertical-align:16px;font-size:1em; color:grey;
}
span.down {
    position: absolute;
    overflow: hidden;
    top:-14px;
}
a.grey { color:grey; }
a.blue { color:cornflowerblue; }
a.green { color:yellowgreen; }
table,td,tr {margin: 0; padding: 0; border: 0;}
.i {
    width: 40px;
    height: 40px;
    display: inline-block;
    margin: 1px;
    transform: rotate(-90deg);
}
.g {
    width: 80px;
    height: 80px;
    display: inline-block;
    margin: 4px;
    transform: rotate(-90deg);
}
.t {
    width: 20px;
    height: 20px;
    display: inline-block;
    margin: 1px;
    transform: rotate(-90deg);
}
.r {
    width: 50px;
    height: 50px;
    display: inline-block;
    margin: 1px;
    transform: rotate(-90deg);
}
h1,h2,h6,div { font-family:'abeatbyKai'; }
h1 {font-size:60px;text-align: center;}
.up { vertical-align:8px; color:grey; }
title { font-family:monospace; }
text {
    font-family:monospace;
    transform: rotate(90deg);
    font-size: 10px;
    fill: white;
}
svg { border-radius: 50%; }
circle { stroke-width: 32; }
a { text-decoration: none; }
span.grey { color:grey; }
span.blue { color:cornflowerblue; }
span.green { color:yellowgreen; }

@keyframes animatedB {
    from { background-position: 0 0; }
    to { background-position: -2400px 0; }
}
@-webkit-keyframes animatedB {
    from { background-position: 0 0; }
    to { background-position: -2400px 0; }
}
.intro {
    background-image: url(bg.jpg);
    background-repeat: repeat-x;
    animation: animatedB 60s linear infinite;
    -webkit-animation: animatedB 60s linear infinite;
}