body {
    width:960px;
    margin:20px auto;
}
header, nav, section, footer {
    display:block;
    border:1px solid #ccc;
    margin:5px;
    border-radius: 5px;
}
header {
    text-align:center;
    padding:0px;
    position:relative;
}
header ul, header li {
    list-style-type:none;
    display:inline;
}
nav {
    float:right;
    width:245px;
    padding:0px;
}
nav ul {
    padding:10px;
    list-style-type: none;
}
nav ul > li {
    margin: 0 0 5px 0;
}
section {
    float:right;
    width:650px;
    padding:20px;
}
footer {
    clear:both !important;
    text-align: center;
    padding:5px;
    position:relative;
}
pre {
   color:#000000;
   padding: 1em;
   border: solid thin;
   margin: 0em 1em;
   overflow: auto;
}

pre.example {
   background: #ddf;
   border-radius: 240px 15px 100px 15px / 15px 200px 15px 185px;
}
pre.command {
   background: #dfd;
   border-radius: 15px 100px 15px 240px/ 200px 15px 185px 15px;
}
pre.message {
   background: #ffd;
}

div.logo {
    float: left;
    position: absolute;
    top:10px;left:50px;
    overflow: hidden;
    width: 50px;
    height: 50px;
    font-size: 200%;
    background-color: rgba(235, 226, 238, 0.719);
    border-radius: 50%;
}

div.logo > div{
    animation : text_scroll 5s linear infinite;
    padding-left:100%;
}
@keyframes text_scroll{
    0% { transform: translateX(0)}
    100% { transform: translateX(-460%)}
}