Untitled

<html>
<head>
    <meta charset="UTF-8">
    <meta name="description" content="Mój pierwszy html">
    <meta name="keywords" content="HTML,CSS,JavaScript">
    <meta name="author" content="Piotr Bryla">
    <meta name="viewport"content="width=device-width, initial-scal=1.0">
    <title>Wiedza w &pi;gułce</title>
    <link rel="icon" href="http://aktywnistudenci.org.pl/akademia_edukatora/app_mobile/logo_pi.png" type="image/png"/>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous"
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
    <style>
    body{
    text-align:center;
    }
    span{
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: center;
}
    @import url('https://fonts.googleapis.com/css?family=Anonymous+Pro');
    #div_nr_1 {
    background-color: #5aa9ad;
    height:100%;
    }
    #div_nr_2 {
    background-color: #36e278;
    height:100%;
    }
    #div_nr_3 {
    background-color: #2041fc;
    height:100%;
    }
    #div_nr_4 {
    background-color: #affc20;
    height:100%;
    }
    #div_nr_5 {
    background-color: #db4d1a;
    height:100%;
    }
    #div_nr_6 {
    background-color: #245cd6;
    height:100%;
    }
    .nasz_header{
        height:10%;
    }
    .nasz_content{
        height:80%;
    }
    .nasz_footer{
        height:10%;
    }
    .container{
        height:720px;
    }
    #logo{
        height:100%;
    }
    .header_text_pi{
        font-family: 'Anonymous Pro', monospace;
        font-size:40px;
    }
    .header_text{
        font-size:40px;
    }
    #text_header{
        border-bottom:dotted 8px blue;
        padding-bottom:8px;
    }

    </style>
</head>
<body>
    <div class="container">
        <div class="row nasz_header">
            <div class="col-md-2" id="div_nr_1">
                <img src="http://aktywnistudenci.org.pl/akademia_edukatora/app_mobile/logo_pi.png" id="logo">
            </div>
            <div class="col-md-6" id="div_nr_2">
                <span id="text_header">
                    <span class="header_text">Wiedza w</span>
                    <span class="header_text_pi">&pi;</span>
                    <span class="header_text">gułce</span>
                </span>
            </div>
            <div class="col-md-4" id="div_nr_3">

            </div>
        </div>
        <div class="row nasz_content">
            <div class="col-md-3" id="div_nr_4">

            </div>
            <div class="col-md-9" id="div_nr_5">

            </div>
        </div>
        <div class="row nasz_footer">
            <div class="col-md-12" id="div_nr_6">

            </div>
        </div>
    </div>
</body>
</html>