    html {
    height: 100%
}

h1,
h2,
h3,
h4,
h5,
h6 {
/*    font-family: 'Muli', sans-serif;*/
}

body {
    height: 100%;
    min-height: 35rem;
    position: relative;
font-family: 'Poppins', sans-serif;


}

/*
@media (min-width: 1600px) {
    
.container {
    max-width: 1550px;
}
}
*/

a {
    color: #212529;
}

a:hover,
a:focus {
    color: #667481;
}
.btn-pill {
    border-radius: 10rem !important;
    padding: 10px 30px; 
}
.bg-dark {
    background-color: #0a0a38!important;
}

.bg-light {
    background-color: #f1eeea;
}

.bg-green {
    background-color: #1ACD1A!important;
}
.text-red {
    color: #e01c1c;
}

.text-dark {
    color: #0a0a38!important;
}

.text-sea {
    color: #4f9cb1;
}

.shadow {
    box-shadow: 0px 0px 15px 1px rgba(0, 0, 0, 0.4);
}

hr {
    border-width: 2px;
    border-color: rgb(191, 195, 204)
}

.btn {
    border-radius: 0
}

.btn-primary {
    border-color: #a60809!important;
    background-color: #a60809!important;
    cursor: pointer;
}

.btn-secondary {
    background-color: #cd9557;
    border-color: #cd9557
}

.btn-secondary:active,
.btn-secondary:focus,
.btn-secondary:hover {
    background-color: #ba7c37!important;
    border-color: #ba7c37!important
}

.input {
    font-weight: 300!important
}

.form-control {
    border-radius: 0;
}

.only-home {
    display: none;
}

.start .only-home {
    display: block
}

small {
    opacity: 0.5
}


/* NAWIGACJA */

@media (min-width: 992px) {
    .navbar {
        padding: .0rem;
    }
}

header {
    background-color: black;
}

.nav-top {
    
    padding-left: 38px;
    text-transform: uppercase;
    z-index: 100000;

}


.navbar-light {
/*
background: rgb(255,0,0);
background: -moz-radial-gradient(circle, rgba(255,0,0,1) 0%, rgba(110,0,19,1) 100%);
background: -webkit-radial-gradient(circle, rgba(255,0,0,1) 0%, rgba(110,0,19,1) 100%);
background: radial-gradient(circle, rgba(255,0,0,1) 0%, rgba(110,0,19,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff0000",endColorstr="#6e0013",GradientType=1);
*/
    box-shadow: 0 1rem 3rem rgba(0,0,0,.4)!important;
    background-color: white;
}

@media (min-width: 992px) {
    .navbar-expand-lg .navbar-nav .nav-link {
      
    }
}
@media (max-width: 767px) {
    
    .navbar-brand {
        max-width: 230px !important
    }
    .navbar-brand img {
        max-width: 100% !important
    }
}
/*
.navbar-brand img {
    max-width: 330px !important
}
*/
@media (min-width: 768px) {
    .navbar-brand img {
        max-width: 430px !important
    }
}
@media (max-width: 320px) {
    .navbar-brand {
        max-width: 190px !important;
    }
}
.navbar-brand span {
    display: block;
    font-size: 1.3rem;
    font-weight: lighter;
    text-align: right;
    line-height: 1.3rem
}

.nav-item {
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    margin-right: 0.5rem;
    border-radius: 10rem;
    text-align: center;
    }
.nav-item:hover {
    background-color: #d40808 !important;
    color: white !important;
    
}

.nav-item:hover a,
.nav-item a:hover {
    color: white!important
}


/*
body.szkolne .nav-item .nav-link.szkolne {
    background-color: greenyellow;    
} 
body.biurowe .nav-item .nav-link.biurowe {
    background-color: #19c1ff;
}
body.kontakt .nav-item .nav-link.kontakt {
    background-color: #d40808;
    color: white !important;
}
body.szkolne .nav-item .nav-link.szkolne:hover,
body.biurowe .nav-item .nav-link.biurowe:hover, 
body.kontakt .nav-item .nav-link.kontakt:hover {
    background-color:#d40808;
    color: white;
}
*/



@media (min-width: 992px) {
    .nav-link {
        padding: 0.5rem 1.5rem !important;
        border-radius: 10rem;
        font-size: 1.15rem
    }
    .dropdown-menu .nav-link {
        padding: 0.8rem 1.5rem
    }
}

.navbar-dark .navbar-nav a {
    color: white!important;
}

.navbar-dark .navbar-nav a:hover {
    background-color: #a60809;
    -webkit-animation-name: animnav;
    /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 2s;
    /* Safari 4.0 - 8.0 */
    animation-name: animnav;
    animation-duration: 2s;
}
.navbar-light .navbar-nav .nav-link {
    color: black;
    opacity: 1.0;
    font-weight: 600;
}
.navbar-light .navbar-nav .nav-link:active {
     color: #fff !important;
    background-color: #d40808 !important;
    border-radius: 10rem;
}

/* Safari 4.0 - 8.0 */

@-webkit-keyframes animnav {
    from {
        background-color: #a60809;
    }
    to {
        background-color: #2e3439;
    }
}


/* Standard syntax */

@keyframes animnav {
    from {
        background-color: #a60809;
    }
    to {
        background-color: #2e3439;
    }
}

.dropdown-menu {
    border-radius: 0;
    border: none;
    background-color: #a20001 !important;
    margin: 0;
    padding: 0;
    min-width: 17rem;
}

.dropdown-menu .nav-link {
    color: white !important;
}

.dropdown-menu .nav-item:hover {
    background-color: #c31e1e !important;
}

body.start .navbar-dark .navbar-nav a.start,
body.oferta .navbar-dark .navbar-nav a.oferta,
body.firma .navbar-dark .navbar-nav a.firma,
body.realizacje .navbar-dark .navbar-nav a.realizacje,
body.kontakt .navbar-dark .navbar-nav a.kontakt {
    color: white!important;
    background-color: #d21617 !important;
}
    
    @media (min-width: 768px) {
        .logo {
            font-size: 3.5rem;
            font-weight: 800;
            font-family: 'Open Sans', sans-serif;
            letter-spacing: -2px;
            color: #a60809
        }
        .logo a {
            text-decoration: none;
            color: #a60809;
        }
        .logo span {
            color: #667481;
        }
        .firma-n {
            float: left;
            line-height: 1.32rem;
            font-size: 1.22rem;
            color: #667481;
        }
        @media (min-width: 992px) and (max-width: 1199px) {
            .firma-n {
                display: none!important
            }
        }
        .adres-n {
            line-height: 1.20rem;
            font-size: 1.0rem;
            color: #667481;
        }
    }
    /* SLIDER */
    @media (min-width: 992px) {
        .carousel {
/*            margin-top: 90px;*/
        }
    }
    .slide {
        display: none;
    }
    .start .slide {
        display: block;
    }
    .carousel-inner {
        background-color: transparent;
    }
    .slajd-1 {
        background-image: url(../img/biuro-slajd.jpg)!important;
    }
    .slajd-2 {
        background-image: url(../img/szkola-slajd.jpg)!important;
    }
    .slajd-1a {
        background-image: url(../img/biuro-slajd-2.jpg)!important;
    }
    .slajd-2a {
        background-image: url(../img/szkola-slajd-2.jpg)!important;
    }
    .slajd-3 {
        background-image: url(../img/slajd-3.jpg)!important;
    }

/*
.ico {
    display: none;
}
@media (min-width: 768px) {
    .ico {
        display: block;
        position: absolute;
        width: 100%;
        z-index: 100;
        top: 180px;
    }    
}
*/
.bg-red {
    background-color: #a60809;
    color: white;
    font-weight: 600;
    font-size: 2rem;
}

.carousel-caption {
    bottom: auto;
    background-color: rgba(0, 0, 0, 0.6);
    left: 0;
    right: 0;
}

.carousel-caption br {
    display: none
}
.carousel-caption a {
    color: white;
    text-decoration: none;
}
.carousel-caption h5 {
    font-weight: 700;
    font-size: 1.5rem
}
.slajd-1 .carousel-caption h5,
.slajd-1 .carousel-caption b {
    color: #57d2ff
}
.slajd-2 .carousel-caption h5,
.slajd-2 .carousel-caption b {
    color: greenyellow;
}
.slajd-3 .carousel-caption h5,
.slajd-3 .carousel-caption b {
    color: #ff3839;
}
.carousel-control-next, .carousel-control-prev {
    align-items: flex-end;
    padding-bottom: 50px;
    width: 10%;
}
.carousel-control-next-icon, .carousel-control-prev-icon {
    width: 40px;
    height: 40px;
}
@media (min-width: 992px) {
    .carousel-caption br {
        display: block;
    }

    .slajd-1 .carousel-caption {
        top: 10%;
        left: auto;
        right: 10%;
        bottom: auto;
       background-color: rgba(0, 0, 0, 0.6);
        padding: 2rem;
        text-align: right;
        width: auto
    }

    .slajd-1 .carousel-caption  h5 {
        font-size: 4.0rem;
        font-weight: 800;
        color: #19c1ff;
    /*    text-shadow: 2px 2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, -2px -2px 0 #000, 2px 0px 0 #000, 0px 2px 0 #000, -2px 0px 0 #000, 0px -2px 0 #000;*/
        text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);
    }
    .carousel-caption p {
        font-size: 1.3rem
    }
    .slajd-1 .carousel-caption  b {
        color: #19c1ff
    }


    .slajd-2 .carousel-caption {
        top: 10%;
        left: auto;
        right: 10%;
        bottom: auto;
       background-color: rgba(0, 0, 0, 0.6);
        padding: 2rem;
        text-align: right;
        width: auto
    }

    .slajd-2 .carousel-caption  h5 {
        font-size: 4.0rem;
        font-weight: 800;
    /*    text-shadow: 2px 2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, -2px -2px 0 #000, 2px 0px 0 #000, 0px 2px 0 #000, -2px 0px 0 #000, 0px -2px 0 #000;*/
        text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);
        color: greenyellow
    }
    .slajd-2 .carousel-caption  b {
        color: greenyellow
    }
    
    
    .slajd-3 .carousel-caption {
        top: 10%;
        left: auto;
        right: 10%;
        bottom: auto;
       background-color: rgba(0, 0, 0, 0.6);
        padding: 2rem;
        text-align: right;
        width: auto
    }

    .slajd-3 .carousel-caption  h5 {
        font-size: 4.0rem;
        font-weight: 800;
    /*    text-shadow: 2px 2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, -2px -2px 0 #000, 2px 0px 0 #000, 0px 2px 0 #000, -2px 0px 0 #000, 0px -2px 0 #000;*/
        text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);
        color: #ff3839
    }
    .slajd-3 .carousel-caption  b {
        color: #ff3839
    }
    
}
.btn-biuro {
    background-color: #19c1ff;
    color: white !important
}
.btn-biuro:hover,
.btn-biuro:focus,
.btn-biuro:active {
    background-color: #0c81ac;
}
.btn-szkola {
    background-color: greenyellow;
    color: black !important
}
.btn-szkola:hover,
.btn-szkola:focus,
.btn-szkola:active {
    background-color:#9ce32e;
}

hr {
    border: 0;
    box-shadow: none;
    background-color: #edf0f5;
    height: 1px
}
    /* OD FUNDAMENTÓW POD KLUCZ */

    .klucz {
        -webkit-animation-name: klucz;
        /* Safari 4.0 - 8.0 */
        -webkit-animation-duration: 2.5s;
        /* Safari 4.0 - 8.0 */
        -webkit-animation-delay: 0.5s;
        /* Safari 4.0 - 8.0 */
        -webkit-animation-fill-mode: forwards;
        /* Safari 4.0 - 8.0 */
        animation-name: klucz;
        animation-duration: 2.5s;
        animation-delay: 0.5s;
        animation-fill-mode: forwards;
    }
    @-webkit-keyframes klucz {
        from {
            top: 80%;
            opacity: 0.0
        }
        to {
            top: 18%;
            opacity: 1.0;
        }
    }
    @keyframes klucz {
        from {
            top: 80%;
            opacity: 0.0
        }
        to {
            top: 18%;
            opacity: 1.0;
        }
    }
    /* STRONKI */
.asortyment {
    background-color: #edf0f5;
/*
    background-image: url(../img/papier.png);
        -webkit-box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
*/
    
}

.asortyment div.col-12.col-lg-2 {
    margin-top: 2rem
}
/*
.asortyment div.col-12.col-lg-2:before {
    content: '';
    width: 31px;
    height: 72px;
    display: block;
    top: -11px;
    left: 30px;
    position: absolute;
    -webkit-box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
    -moz-box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
    box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
    background-image: url(../img/spinacz.png);
    background-size: 100% 100%
    }
*/

.asortyment img {
    border-radius: 0rem;
    border: 3px solid white;
/*
    -webkit-box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
*/
}

.asortyment h4 {
font-size: 1.2rem;
    font-weight: 800;
    color: #000000;
    margin-top: 0.5rem;
    text-transform: uppercase;
}

/*
@media (min-width: 768px) {
.col-md-2 {
    -ms-flex: 0 0 20.0% !important;
    flex: 0 0 20.0% !important;
    max-width: 20.0% !important;
}
}
*/
.btn-lg {
    padding: 0.8rem 3rem;
    border-radius: 10rem;
    font-weight: 700;
    
}
    .tytul {
        font-size: 2.0rem;
        font-weight: 600;
        text-align: center;
        color: #d40808;
        margin-bottom: 3rem;
        padding-bottom: 1rem;
    }
/*
    @media (min-width: 768px) {
        .tytul::after,
        .tytul::before {
            display: inline-block;
            margin: 17px 20px 12px;
            width: 50px;
            height: 1px;
            background: #c3ced8 none repeat scroll 0% 0%;
            content: "";
        }
    }
*/

    .podtytul {
        text-align: right;
        color: rgb(191, 195, 204);
        font-weight: 700;
        font-size: 1.2rem;
    }
    .firma b,
    .oferta b {
        font-weight: 600;
        /*	color: rgb(3, 4, 175);*/
    }
    .firma i {
        font-size: 0.9rem;
        font-style: normal;
        text-transform: uppercase;
    }

/* STOPKA */
 footer {
        background-color: #e2e4e8;   
         -webkit-box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
        -moz-box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
        box-shadow: 0px 18px 28px -22px rgba(0,0,0,0.4);
    }

@media (min-width: 768px) {
    footer {
        background-image: url(../img/footer.jpg);
        background-size: cover;
         min-height: 250px;
        
    }
}

footer .adres {
    margin-top: 30px;
    margin-bottom: 30px;
    background-color: white;
    width: auto;
    display: inline-block;
    padding: 30px 50px
    
}
footer small {
    opacity: 1.0;
    color: #667481;
    font-size: 1.1rem
}
    footer p {
        font-size: 1.1rem!important
    }
    .h5 {
        font-weight: 300;
        line-height: 1.9rem;
    }
    .icons {
        font-size: 0.7rem;
        float: left;
        text-align: left;
        opacity: 0.5
    }
    footer p a {
        
    }
    div.infocity {
        float: right;
    }
    a.infocity {
        background-image: url(../images/infocity.png);
        background-repeat: no-repeat;
        background-position: left 60%;
        font-size: 0.9rem;
        padding-left: 1.0rem;
        line-height: 2rem;
        z-index: 10000;
        color: #545454;
        font-weight: 300
    }
    .licencje {
        color: #212529;
        border-top: 1px dotted #212529;
        text-align: left;
        font-size: 0.8rem;
        opacity: 0.7;
    }
    .licencje a {
        color: #212529!important;
    }
    /* GŁÓWNA */
    .ikony {
/*      background-color: rgba(158, 158, 158, 0.2);*/
        background-color: white;
    }
    .ikonka {
        border-radius: 50%;
        opacity: 0.0;
    }
    .wys {
        height: 139px;
        width: 139px;
        vertical-align: middle;
        overflow: hidden;
        margin: auto;
        opacity: 1.0
    }
.ico img {
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    -ms-transition: all 0.6s ease-in-out;
    
}
.ico img:hover {
    transform: rotate(-15deg);
    -webkit-transform: rotate(-15deg);
    -moz-transform: rotate(-15deg);
    -o-transform: rotate(-15deg);
}

    /* ------------------------------ */
    .ikonka {
        -webkit-animation-name: ikon;
        /* Safari 4.0 - 8.0 */
        -webkit-animation-duration: 1.5s;
        /* Safari 4.0 - 8.0 */
        -webkit-animation-delay: 0.5s;
        /* Safari 4.0 - 8.0 */
        -webkit-animation-fill-mode: forwards;
        /* Safari 4.0 - 8.0 */
        animation-name: ikon;
        animation-duration: 1.5s;
        animation-delay: 0.5s;
        animation-fill-mode: forwards;
    }
    .ikonka.iko-2 {
        -webkit-animation-delay: 1.0s;
        animation-delay: 1.0s;
    }
    .ikonka.iko-3 {
        -webkit-animation-delay: 1.5s;
        animation-delay: 1.5s;
    }
    @-webkit-keyframes ikon {
        from {
            opacity: 0.0;
        }
        to {
            opacity: 1.0;
        }
    }
    @keyframes ikon {
        from {
            opacity: 0.0;
        }
        to {
            opacity: 1.0;
        }
    }
    /* ------------------------------ */
    .ikony h3 {
        font-size: 1.7rem;
        font-weight: 900;
        color: #c34017;
    }
    .ikony h3 span {
        font-weight: 300;
        font-size: 1.2rem;
    }
    .intro h1 {
        font-size: 1.3rem
    }
    .intro p {
        
    }
    .intro p b {
        font-weight: 800;
    }
    .fotki {
       background-image: url(../img/fotki.jpg);
        background-size: cover;
       
    }
.fotki2 {
       background-image: url(../img/fotki2.jpg);
        background-size: cover;
/*    background-attachment: fixed;*/
       
    }
.fotki img {
    border: 5px solid white;
    border-radius: 50%;
}
img.hurt {
    border: 3px solid #d9d9d9;
    -webkit-box-shadow: 2px 27px 50px -5px rgba(0,0,0,0.8);
-moz-box-shadow: 2px 27px 50px -5px rgba(0,0,0,0.8);
box-shadow: 2px 27px 50px -5px rgba(0,0,0,0.8);
}
    .oferta-index {
        position: absolute;
        margin-bottom: 2rem;
        width: 100%;
        color: rgba(240, 248, 255, 0.88);
        font-weight: 700;
        font-size: 1.2rem;
    }
    @media (min-width: 768px) {
        .oferta-index {
            font-size: 1.6rem;
        }
    }
    .oferta-index ul {
        margin-top: 2rem;
        width: 100%;
        text-align: right
    }
    @media (max-width: 767px) {
        .oferta-index ul br {
            display: none;
        }
    }
    .oferta-index ul>li {
        margin-left: 1rem;
        margin-right: 1rem;
        display: inline-block
    }
    .oferta-index ul>li>a {
        display: block;
        color: #fff;
        background-color: rgba(255, 193, 7, 0.9);
        border-radius: 100%;
        line-height: 4rem;
        height: 4rem;
        width: 4rem
    }
    @media (min-width:768px) {
        .oferta-index {
            margin: 0;
            position: absolute;
            right: 2.5rem;
            bottom: 2rem;
            width: auto
        }
        .oferta-index ul {
            margin-top: 0;
            width: auto
        }
        .oferta-index ul>li {
            display: block;
            margin-left: 0;
            margin-right: 0;
            margin-bottom: 2rem
        }
        .oferta-index ul>li:last-child {
            margin-bottom: 0
        }
        .oferta-index ul>li>a {
            transition: all .2s ease-in-out;
            font-size: 2rem;
            line-height: 4rem;
            height: 4rem;
            width: 4rem
        }
        .oferta-index ul>li>a:hover {
            background-color: #262f38;
        }
    }
    /*!
* Start Bootstrap - Full Slider (https://startbootstrap.com/template-overviews/full-slider)
* Copyright 2013-2017 Start Bootstrap
* Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-full-slider/blob/master/LICENSE)
*/




.carousel-indicators {
    display: none
}
@media (min-height: 992px) {
    .carousel-indicators {
    display: inline-flex
}
}



    .carousel-item {
        height: 60vh;
        min-height: 300px;
        background: no-repeat center center scroll;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    body.home .carousel-item {
        height: 100vh;
    }
    .carousel-indicators li {
        height: 35px;
        width: 35px;
        border-radius:50% !important;
    }
    /* OFERTA */
    .card {
        border: none;
    }
    .oferta p,
    .firma p,
    .firma li {
        font-size: 1.2rem
    }
    /* KONTAKT  */
    .kontakt .podtytul {
        text-align: left;
    }
    textarea {
        height: 200px
    }
    .kontakt p.dane {
        font-size: 1.4rem
    }
    .kontakt .cont {
        width: 90px;
        display: inline-block
    }
    .fot-o:hover {
        -o-transition: all 0.6s;
        -moz-transition: all 0.6s;
        -webkit-transition: all 0.6s;
        -moz-transform: scale(1.05);
        -o-transform: scale(1.05);
        -webkit-transform: scale(1.05);
    }
    .fot-o {
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -o-transition: all 1s ease;
    }
.kontakt-none {
    display: none;
}
body.start .kontakt-none {
    display: block;
}
.szkola {
    height: 20vh;
    min-height: 250px;
    background-image: url(../img/szkola-top.jpg);
    background-size: cover;
    background-position: bottom;   
}
.biuro {
    height: 20vh;
    min-height: 250px;
    background-image: url(../img/biuro-top.jpg);
    background-size: cover;
    background-position: bottom;   
}
.container-fluid.artykuly {
    max-width: 1600px
}
.container-fluid.artykuly img {
/*    border-radius: 50%*/
}
.szkola .caption {
    top: 0;
    bottom: 0;
    display: flex;
    width: 100%;
   
}

.szkola .tytul {
    
    /* text-shadow: 2px 2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, -2px -2px 0 #000, 2px 0px 0 #000, 0px 2px 0 #000, -2px 0px 0 #000, 0px -2px 0 #000; */
    text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);
    color: greenyellow;
    margin: 70px auto;
    text-align: center;
    display: none
}
.biuro .caption {
    top: 0;
    bottom: 0;
    display: flex;
    width: 100%;
   
}

.biuro .tytul {
    
    /* text-shadow: 2px 2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, -2px -2px 0 #000, 2px 0px 0 #000, 0px 2px 0 #000, -2px 0px 0 #000, 0px -2px 0 #000; */
    text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);
    color: #19c1ff;
    margin: 70px auto;
    text-align: center;
    display: none
}
.artykuly h4 {
    color: white;
    background-color: #19c1ff;
    padding: 10px 4px;
    font-weight: 700;
    text-align: center;
    -webkit-border-top-left-radius: 1rem;
    -webkit-border-top-right-radius: 1rem;
    -moz-border-radius-topleft: 1rem;
    -moz-border-radius-topright: 1rem;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    margin-bottom: 0
}

.art-title {
/*    text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);*/
    text-align: center;
    font-size: 2.5rem;
    font-weight: 700;
    margin: 1.5rem auto;
    color: black;
}
.szkolne .art-title {
    color: black;
/*    text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);*/
}
.kontakt .art-title {
    color: #d40808
}
@media (min-width: 768px) {
    
    .szkola .tytul,
    .biuro .tytul {
        display: block;
        font-size: 4.0rem;
        font-weight: 800;
    }
    
    
    .artykuly h4 {
        margin-bottom: 30px;
        -webkit-border-radius: 10rem;
        -moz-border-radius: 10rem;
        border-radius: 10rem;
    }
}


.szkolne .artykuly h4 {
    background-color: greenyellow !important;
    color: black;
}
.artykuly ul {
    list-style: none;
    padding-left: 0;
    
}
.artykuly ul li:before {
    display: inline-block;
    height: 6px;
    width: 6px;
    background-color: #19c1ff;
    margin-right: 10px;
    content: '';
    margin-bottom: 5px;
}
.artykuly ul li {
    text-indent: -15px
}
.szkolne .artykuly ul li:before {
      background-color: greenyellow;
}
.producenci {
    text-align: center;
    padding: 2rem;
    border-top: 1px solid #edf0f5;
    margin-top: 2rem;
    font-size: 0.8rem;
    text-transform: uppercase;
    color: grey
}
.producenci span {
    display: inline-block;
    width: 3px;
    height: 3px;
    background-color: #19c1ff;
    margin: 0 5px
}