/*body {
    background-color: rgb(39, 76, 119);
}

#banner {
    height: 50px;
}

#logo {
    float: left;
    margin-left: 5%;
}

#kolor {
    float: right;
    background-color: rgb(96, 150, 186);
    border: rgb(163, 206, 241) 1px solid;
    box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
    border-radius: 10px;
    margin-right: 5%;
    padding: 10px;
}

#menu {
    clear: both;
    text-align: center;
    height: 70px;
    line-height: 70px;
    background-color: rgb(96, 150, 186);
    border: rgb(163, 206, 241) 1px solid;
    box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
    border-radius: 10px;
    margin-left: 5%;
    margin-right: 5%;
}

.link {
    text-decoration: none;
    color: black;
    margin: 20px;
    font-size: large;
    padding: 10px;
    background-color: rgb(231, 236, 239);
    box-shadow: 0px 0px 5px 5px lightgray;
    border-radius: 10px;
}

.link:hover {
    background-color: rgb(39, 76, 119);
    box-shadow: 0px 0px 10px 10px rgb(39, 76, 119);
    color: rgb(231, 236, 239);
}

#main,
#main2,
.prpart,
#main-2 {
    background-color: rgb(231, 236, 239);
    border: rgb(163, 206, 241) 1px solid;
    box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
    border-radius: 10px;
    margin-left: 5%;
    margin-right: 5%;
    margin-top: 35px;
    padding: 20px;
    overflow: auto;
}

img {
    width: 50%;
    border-radius: 10px;
}

.primage {
    float: right;
}

#qrid,
#term {
    width: 50%;
    float: left;
}

.prtitle {
    clear: both;
}

/*
.mainindex{
    background-color: cornsilk;
    border: black 1px solid;
    box-shadow: 0px 0px 10px 5px rgb(100, 100, 100);
    border-radius: 10px;
    margin-left: 5%;
    margin-right: 5%;
    margin-top: 35px;
    padding: 20px;
}*/



@media screen and (max-device-width: 479px) {
    /*ustawienia na 400px*/
    body {
        background-color: rgb(39, 76, 119);
        font-size: larger;
    }
    
    #banner {
        height: 80px;
    }
    
    #logo {
        float: left;
        margin-left: 5%;
    }
    
    #kolor {
        float: right;
        background-color: rgb(96, 150, 186);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-right: 5%;
        padding: 10px;
        height: 80%;
        font-size: x-large;
    }

    #color {
        height: 60px;
        font-size: x-large;
        border-radius: 10px;
        border: 0;
    }
    
    #menu {
        clear: both;
        text-align: center;
        height: 170px;
        line-height: 170px;
        background-color: rgb(96, 150, 186);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-left: 5%;
        margin-right: 5%;
        margin-top: 5%;
    }
    
    .link {
        text-decoration: none;
        color: black;
        margin: 20px;
        font-size: xx-large;
        padding: 10px;
        background-color: rgb(231, 236, 239);
        box-shadow: 0px 0px 5px 5px lightgray;
        border-radius: 10px;
    }
    
    .link:hover {
        background-color: rgb(39, 76, 119);
        box-shadow: 0px 0px 10px 10px rgb(39, 76, 119);
        color: rgb(231, 236, 239);
    }
    
    #main,
    #main2,
    .prpart,
    #main-2 {
        background-color: rgb(231, 236, 239);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-left: 5%;
        margin-right: 5%;
        margin-top: 35px;
        padding: 20px;
        overflow: auto;
    }

    img {
        border-radius: 10px;
    }

    .primage {
        width: 100%;
    }
    
}

@media screen and (min-device-width:480px) and (max-device-width:767px) {
    /*ustawienia na 640px*/
    body {
        background-color: rgb(39, 76, 119);
    }
    
    #banner {
        height: 50px;
    }
    
    #logo {
        float: left;
        margin-left: 5%;
    }
    
    #kolor {
        float: right;
        background-color: rgb(96, 150, 186);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-right: 5%;
        padding: 10px;
    }

    #color {
        border-radius: 10px;
        border: 0;
    }
    
    #menu {
        clear: both;
        text-align: center;
        height: 70px;
        line-height: 70px;
        background-color: rgb(96, 150, 186);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-left: 5%;
        margin-right: 5%;
    }
    
    .link {
        text-decoration: none;
        color: black;
        margin: 20px;
        font-size: large;
        padding: 10px;
        background-color: rgb(231, 236, 239);
        box-shadow: 0px 0px 5px 5px lightgray;
        border-radius: 10px;
    }
    
    .link:hover {
        background-color: rgb(39, 76, 119);
        box-shadow: 0px 0px 10px 10px rgb(39, 76, 119);
        color: rgb(231, 236, 239);
    }
    
    #main,
    #main2,
    .prpart,
    #main-2 {
        background-color: rgb(231, 236, 239);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-left: 5%;
        margin-right: 5%;
        margin-top: 35px;
        padding: 20px;
        overflow: auto;
    }
    
    img {
        border-radius: 10px;
    }
    
    .primage {
        width: 100%;
    }
    
    .prtitle {
        clear: both;
    }
}

@media screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    /*ustawienia na 1000px*/
    body {
        background-color: rgb(39, 76, 119);
    }
    
    #banner {
        height: 50px;
    }
    
    #logo {
        float: left;
        margin-left: 5%;
    }
    
    #kolor {
        float: right;
        background-color: rgb(96, 150, 186);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-right: 5%;
        padding: 10px;
    }

    #color {
        border-radius: 10px;
        border: 0;
    }
    
    #menu {
        clear: both;
        text-align: center;
        height: 70px;
        line-height: 70px;
        background-color: rgb(96, 150, 186);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-left: 5%;
        margin-right: 5%;
    }
    
    .link {
        text-decoration: none;
        color: black;
        margin: 20px;
        font-size: large;
        padding: 10px;
        background-color: rgb(231, 236, 239);
        box-shadow: 0px 0px 5px 5px lightgray;
        border-radius: 10px;
    }
    
    .link:hover {
        background-color: rgb(39, 76, 119);
        box-shadow: 0px 0px 10px 10px rgb(39, 76, 119);
        color: rgb(231, 236, 239);
    }
    
    #main,
    #main2,
    .prpart,
    #main-2 {
        background-color: rgb(231, 236, 239);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-left: 5%;
        margin-right: 5%;
        margin-top: 35px;
        padding: 20px;
        overflow: auto;
    }
    
    img {
        width: 50%;
        border-radius: 10px;
    }
    
    .primage {
        float: right;
    }
    
    #qrid,
    #term {
        width: 50%;
        float: left;
    }
    
    .prtitle {
        clear: both;
    }
}

@media screen and (min-device-width: 1025px) {
    /*ustawienia na ponad 1024px*/
    body {
        background-color: rgb(39, 76, 119);
    }
    
    #banner {
        height: 50px;
    }
    
    #logo {
        float: left;
        margin-left: 5%;
    }
    
    #kolor {
        float: right;
        background-color: rgb(96, 150, 186);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-right: 5%;
        padding: 10px;
    }

    #color {
        border-radius: 10px;
        border: 0;
    }
    
    #menu {
        clear: both;
        text-align: center;
        height: 70px;
        line-height: 70px;
        background-color: rgb(96, 150, 186);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-left: 5%;
        margin-right: 5%;
    }
    
    .link {
        text-decoration: none;
        color: black;
        margin: 20px;
        font-size: large;
        padding: 10px;
        background-color: rgb(231, 236, 239);
        box-shadow: 0px 0px 5px 5px lightgray;
        border-radius: 10px;
    }
    
    .link:hover {
        background-color: rgb(39, 76, 119);
        box-shadow: 0px 0px 10px 10px rgb(39, 76, 119);
        color: rgb(231, 236, 239);
    }
    
    #main,
    #main2,
    .prpart,
    #main-2 {
        background-color: rgb(231, 236, 239);
        border: rgb(163, 206, 241) 1px solid;
        box-shadow: 0px 0px 10px 5px rgb(163, 206, 241);
        border-radius: 10px;
        margin-left: 5%;
        margin-right: 5%;
        margin-top: 35px;
        padding: 20px;
        overflow: auto;
    }
    
    img {
        width: 50%;
        border-radius: 10px;
    }
    
    .primage {
        float: right;
    }
    
    #qrid,
    #term {
        width: 50%;
        float: left;
    }
    
    .prtitle {
        clear: both;
    }
}