@import "normalize.css";
@import "reset.css";

/* --- ustawienia ogólne --- */

.container {
    width: 1300px;
    min-width: 280px;
}

.home_text {
    color: #656869;
    font: 300 19px/32px 'Cairo', sans-serif;
    margin: 0;
}

.home_text2 {
    color: #182b39;
    font: 400 32px/44px 'Cairo', sans-serif;
}

.c_orange {
    color: #ec6707;
}

.c_black {
    color: #182b39;
}

strong {
    font-weight: 600;
}

#content_podstrony {
    display: flex;
    justify-content: center;
    padding: 80px 0 70px;
}

.cms {
    display: inline-block;
    width: 100%;
}

.cms h1, h1 {
    font: 700 72px/82px 'Cairo', sans-serif;
    color: #182b39;
    margin-bottom: 60px;
}

.cms h2, h2 {
    font: 700 56px/64px 'Cairo', sans-serif;
    color: #182b39;
    margin-bottom: 50px;
}

.cms h3, h3 {
    font: 700 42px/52px 'Cairo', sans-serif;
    color: #182b39;
    margin-bottom: 40px;
}

.cms h4, h4 {
    font: 700 32px/43px 'Cairo', sans-serif;
    color: #182b39;
    margin-bottom: 35px;
}

.cms h5, h5 {
    font: 700 24px/34px 'Cairo', sans-serif;
    color: #182b39;
    margin-bottom: 30px;
}

.cms p, p {
    font: 300 17px/32px 'Cairo', sans-serif;
    color: #656869;
    margin-bottom: 30px;
}

.cms > img,
.cms p img {
    max-width: 100%;
    height: auto;
    margin: 50px 0;
    display: block;
}

.cms hr, hr {
    margin: 50px 0;
    background: #f4f4f4;
    border: none;
    width: 100%;
    height: 1px;
}

.cms a {
    color: #ec6707;
}
.cms a.tel {
    color: #656869;
}

.cms ul {
    margin: 0 0 40px 20px;
    overflow: auto;
}

.cms ol {
    margin: 0 0 40px 0;
    overflow: auto;
}

.cms ol ul, 
.cms ol ol, 
.cms ul ul, 
.cms ul ol {
    margin: 15px 0 0 0;
}

.cms li {
    font: 300 17px/32px 'Cairo', sans-serif;
    color: #656869;
    margin-bottom: 15px;
    padding-left: 25px;
    position: relative;
}

.cms ul > li:before {
    position: absolute;
    content: '';
    height: 5px;
    width: 5px;
    border-radius: 100%;
    background: #ec6707;
    left: 0;
    top: 14px;
}

.cms ul > li:last-of-type,
.cms ol > li:last-of-type {
    margin-bottom: 0;
}

.cms ol > li {
    list-style-type: decimal;
    margin-left: 35px;
    padding-left: 10px;
}

.cms table {
    background-color: #f4f4f4;
    border-collapse: collapse;
    margin: 0 0 50px 0;
    width: 100%;
    overflow-x: auto;
}

.cms > table td, .cms > table th {
    border: 1px solid #fff;   
    text-align: center;
    vertical-align: middle;
    padding: 30px 35px;
}

.cms > table thead th {
    border-bottom: 2px solid #ec6707;
    font: 700 18px/24px 'Cairo', sans-serif;
    color: #182b39;
}

.cms > table tbody {
    font: 300 16px/20px 'Cairo', sans-serif;
    color: #182b39;
}

/* --- buttony --- */

.button {
    font: 600 16px/16px 'Cairo', sans-serif;
    color: #182b39;
    border: 2px solid #ec6707;
    border-radius: 25px;
    text-align: left;
    position: relative;
    display: inline-block;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s; 
}

.button:hover {
    color: #fff;
    background-color: #ec6707;
}

.button:after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translate(0,-50%) rotate(90deg);
    width: 21px;
    height: 24px;
    background: url(../grafika/arrow_orange.png);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s; 
}

.button:hover:after {
    background: url(../grafika/arrow_white.png);
}

.button_white {
    color: #fff;
    border-color: #fff;
}

.button_white:hover {
    border-color: #ec6707;
}

.button_white:after {
    background: url(../grafika/arrow_white.png);
}

.button_prawy {
    padding: 15px 85px 15px 40px;
}

.button_prawy:after {
    right: 35px;   
}

.button_prawy:hover:after {
    right: 25px;
}

.bg_white {
    background-color: #fff;
}

.button_lewy {
    padding: 15px 40px 15px 85px;
    text-align: right;
}

.button_lewy:after {
    left: 35px;
    transform: translate(0,-50%) rotate(-90deg);
}

.button_lewy:hover:after {
    left: 25px;
}

/* --- pliki na podstronie --- */

#pliki {
    margin: 0 0 50px 0;
}

#pliki a {
    font: 600 17px/22px 'Cairo', sans-serif;
    color: #656869;
    margin-bottom: 20px;
    position: relative;
    display: block;
    padding: 0 0 0 45px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#pliki a:last-of-type {
    margin-bottom: 0;
}

#pliki a:hover {
    color: #ec6707;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#pliki a:before {
    content: '';
    width: 25px;
    height: 24px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0,-50%);
    background: url('../grafika/ico_download.png');
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

/* --- galeria na podstronie --- */

#galeria {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    margin: 0 0 50px 0;
    justify-content: center;
}

#galeria a {
    position: relative;
    margin: 10px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    overflow: hidden;
    width: 305px;
    height: 305px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#galeria a img {
    height: 100%;
    width: 100%;
    display: block;
    overflow: hidden;
    transition-duration: 4s;
}

#galeria a:hover img {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    overflow: hidden;
}

#galeria a:before,
#galeria a:after {
    position: absolute;
    content: '';
    opacity: 0;
    background-size: cover;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    z-index: 1;
}

#galeria a:before {
    width: 100%;
    height: 100%;
    background: url("../grafika/maska.png");
}

#galeria a:after {
    width: 74px;
    height: 74px;
    background: url("../grafika/ico_lupa.png");
}

#galeria a:hover:before,
#galeria a:hover:after {
    opacity: 1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s; 
}

/* --- kategorie --- */

#kategorie {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.kategoria {
    width: 305px;
    height: 305px;
    margin: 0 10px 30px;
    display: block;
    padding: 100px 30px 40px;
    background: #f4f4f4;
    position: relative;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.kategoria:hover {
    background: #fbfbfb;
}

.kategoria .kategoria_nazwa {
    color: #182b39;
    font: 600 23px/31px 'Cairo', sans-serif;
    text-align: center;
    display: block;
    height: 124px;
    overflow: hidden;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.kategoria:hover .kategoria_nazwa {
    color: #ec6707;
}

.kategoria .pasek {
    width: 76%;
    height: 6px;
    display: block;
    margin: 0;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%,0);
    border-radius: 3px;
    background: #eaeaea;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.kategoria .pasek span {
    width: 20%;
    height: 6px;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%,0);
    border-radius: 3px;
    background: #ec6707;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;   
}

.kategoria:hover .pasek span {
    width: 100%;
}

/* ---- paginacja ---- */

#paginacja {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #656869;
    font: 300 17px/17px 'Cairo', sans-serif;
    margin-bottom: 50px;
}

#paginacja select {
    border: 2px solid #f4f4f4;
    margin: 0 15px;
    padding: 0 15px;
    color: #323a45;
    font: 300 14px/14px 'Cairo', sans-serif;
    height: 50px;
    width: auto;
    text-align: center;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
}

#paginacja select:focus,
#paginacja select:hover {
    border: 2px solid #ec6707;
}

.button_pag {
    width: 50px;
    height: 50px;
    border-radius: 100%;
    border: 2px solid #ec6707;
    position: relative;
    margin: 0 15px;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
}

.button_pag:hover {
    background: #ec6707;
}

.button_pag:before {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) rotate(-90deg);
    width: 21px;
    height: 24px;
    content: '';
    background: url(../grafika/arrow_orange.png);
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
}

.button_pag_next:before {
    transform: translate(-50%, -50%) rotate(90deg);
}

.button_pag:hover:before {
    background: url(../grafika/arrow_white.png);
}

/* --- header --- */

header {
    position: absolute;
    width: 100%;
    z-index: 105;
    padding: 0 50px;
    margin-top: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;
}

#header_left img {
    height: 46px;
    width: 277px;
}

#header_right {
    display: flex;
    flex-direction: column;
}

#header_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

#header_fb {
    font: 400 13px/14px 'Cairo', sans-serif;
    padding-left: 40px;
    margin-left: 23px;
    position: relative;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s; 
}

#header_fb:after {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0,-50%);
    width: 30px;
    height: 30px;
    background: url(../grafika/ico_fb.png);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s; 
}

#header_fb:hover:after {
    background: url(../grafika/ico_fb_hover.png);
}

#header_flagi {
    height: 30px;
}

#header_flagi a {
    height: 30px;
    width: 30px;
    margin-left: 13px;
    display: inline-block;
    overflow: hidden;
}

#header_flagi .lang_pl {
    background: url(../grafika/flaga_pl.png) 0 0 no-repeat;
}

#header_flagi .lang_pl:hover,
#header_flagi .lang_pl.active {
    background: url(../grafika/flaga_pl.png) 0 -30px no-repeat;
}

#header_flagi .lang_en {
    background: url(../grafika/flaga_gb.png) 0 0 no-repeat;
}

#header_flagi .lang_en:hover,
#header_flagi .lang_en.active {
    background: url(../grafika/flaga_gb.png) 0 -30px no-repeat;
}

#header_flagi .lang_cz {
    background: url(../grafika/flaga_cz.png) 0 0 no-repeat;
}

#header_flagi .lang_cz:hover,
#header_flagi .lang_cz.active {
    background: url(../grafika/flaga_cz.png) 0 -30px no-repeat;
}
#header_flagi .lang_de {
    background: url(../grafika/flaga_de.png) 0 0 no-repeat;
}

#header_flagi .lang_de:hover,
#header_flagi .lang_de.active {
    background: url(../grafika/flaga_de.png) 0 -30px no-repeat;
}
#header_flagi .lang_ru {
    background: url(../grafika/flaga_ru.png) 0 0 no-repeat;
}

#header_flagi .lang_ru:hover,
#header_flagi .lang_ru.active {
    background: url(../grafika/flaga_ru.png) 0 -30px no-repeat;
}

#header_bottom  {
    z-index: 5;
}

#header_bottom .menu_1 {
    display: flex;
}

#header_bottom .menu_1 li {
    position: relative;
}

#header_bottom .menu_1 > li {
    margin-left: 5px;
}       

#header_bottom .menu_1 > li > a {
    text-transform: uppercase;
    display: block;
    font: 600 18px/18px 'Cairo', sans-serif;  
    padding: 14px 23px;
    border-radius: 25px;
    /*    -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        transition: all 0.3s;   */
}

#header_bottom .menu_1 > li:hover > a.hover_2 {
    border-radius: 25px 25px 0 0;
}


#header_bottom .menu_1 > li > a.active,
#header_bottom .menu_1 > li > a:hover,
#header_bottom .menu_1 > li:hover > a {
    background-color: #ec6707;
}
/*
nav .menu_1 > li > .pusty {
    width: 100%;
    height: 23px;
    background-color: transparent;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: -1;
    cursor: pointer;
    display: none;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}*/

#header_bottom .menu_2 {
    display: none;
    position: absolute;
    left: 0;
    bottom: 0;
    transform: translate(0, 100%);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    padding: 25px 0;
    background-color: transparent;
    border-radius: 0 25px 25px 25px;
    cursor: pointer;
}

/*#header_bottom .menu_1 > li:hover .pusty,*/
#header_bottom .menu_1 > li:hover .menu_2 {
    display: block;
    background-color: #ec6707;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#header_bottom .menu_2 > li > a {
    font: 600 17px/20px "Cairo", sans-serif;
    color: #fff;
    background-color: #ec6707;
    width: 260px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 23px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#header_bottom .menu_2 > li > a span {
    width: 28px;
    height: 28px;
    border-radius: 100%;
    position: relative;
    margin-left: 10px;
    background-color: #d55d06;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#header_bottom .menu_2 > li:hover > a span {
    background-color: #ff6f08;
}

#header_bottom .menu_2 > li > a span:after {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 14px;
    height: 14px;
    content: '';
    background: url(../grafika/ico_plus.png);
    opacity: 1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#header_bottom .menu_2 > li:hover > a span:after {
    opacity: 0;
}

#header_bottom .menu_2 > li > a span:before {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 14px;
    height: 12px;
    content: '';
    background: url(../grafika/arrow_menu.png);
    opacity: 0;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#header_bottom .menu_2 > li:hover > a span:before {
    opacity: 1;
}

#header_bottom .menu_2 > li > a:hover,
#header_bottom .menu_2 > li:hover > a,
#header_bottom .menu_3 > li > a:hover {
    background-color: #ff6f08;
}

#header_bottom .menu_3 {
    display: none;
    position: absolute;
    left: 100%;
    top: -9px;
    background: #ec6707;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    padding: 20px 0;
    border-radius: 0 20px 20px 0;
    cursor: pointer;
    width: 200px;
    margin-left: -1px;
}

#header_bottom .menu_2 li:hover .menu_3 {
    display: block;
}

#header_bottom .menu_3 > li > a {
    font: 600 15px/17px "Cairo", sans-serif;
    color: #fff;
    background-color: #ec6707;
    width: auto;
    display: block;
    padding: 10px 20px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

/* --- menu mobilne --- */

#hamburger {
    display: none;
    z-index: 5;
    overflow: hidden;
}

.ham {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform 400ms;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.hamRotate.active {
    transform: rotate(45deg);
}

.hamRotate180.active {
    transform: rotate(180deg);
}

.line {
    fill:none;
    transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
    stroke:#fff;
    stroke-width:5.5;
    stroke-linecap:round;
}

.ham8 .top {
    stroke-dasharray: 40 160;
}

.ham8 .middle {
    stroke-dasharray: 40 142;
    transform-origin: 50%;
    transition: transform 400ms;
    stroke: #ec6707;
}

.ham8 .bottom {
    stroke-dasharray: 40 85;
    transform-origin: 50%;
    transition: transform 400ms, stroke-dashoffset 400ms;
}

.ham8.active .top {
    stroke-dashoffset: -64px;
}

.ham8.active .middle {
    transform: rotate(90deg);
}

.ham8.active .bottom {
    stroke-dashoffset: -64px;
}

#overlay {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    visibility: hidden;
    -webkit-transition: opacity .35s, visibility .35s, width .35s;
    transition: opacity .35s, visibility .35s, width .35s;
    z-index: 99;
    overflow: hidden;
}

#overlay.open {
    visibility: visible;
}

#menu-mobile {
    overflow-x: hidden;
    height: 100%;
    width: 100%;
    position: relative;
    right: -100%;
    z-index: 99;
    color: #fff;
    background: #323a45;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    padding: 160px 0 20px;
    box-sizing: border-box;
}

#menu-mobile.open,
#overlay .belka.open{
    right: 0;
}

#overlay .belka {
    height: 130px;
    width: 100%;
    background: #323a45;
    position: fixed;
    right: -100%;
    top: 0;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    z-index: 100;
}

#menu-mobile .menu_2 {
    margin-top: 10px;
}

#menu-mobile .menu_1 > li > a {
    color: #fff;
    font: 600 20px/20px 'Cairo', sans-serif;
    text-transform: uppercase;
    padding: 12px 20px;
    display: inline-block;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#menu-mobile .menu_1 > li > a:hover,
#menu-mobile .menu_1 > li > a.active {
    color: #ec6707;
}

#menu-mobile .menu_2 > li {
    position: relative;
}

#menu-mobile .menu_2 .menu_plus {
    position: absolute;
    right: 20px;
    top: 6px;
}

#menu-mobile .menu_2 > li > a {
    color: #fff;
    font: 600 18px/20px 'Cairo', sans-serif;
    padding: 10px 70px 10px 40px;
    display: inline-block;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    background-color: #ec6707;
    width: 100%;
}

#menu-mobile .menu_2 > li > a:hover,
#menu-mobile .menu_2 > li > a.active {
    background-color: #ff6f08;
}

#menu-mobile .menu_3 > li > a {
    color: #fff;
    font: 600 16px/18px 'Cairo', sans-serif;
    padding: 8px 0 8px 60px;
    display: inline-block;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    background-color: #ff6f08;
    width: 100%;
}

#menu-mobile .menu_3 > li > a:hover,
#menu-mobile .menu_3 > li > a.active {
    background-color: #ff9142;
}

#menu-mobile .menu_plus {
    width: 28px;
    height: 28px;
    border-radius: 100%;
    position: relative;
    top: 8px;
    margin-left: 30px;
    display: inline-block;
    background-color: #d55d06;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    cursor: pointer;
}

#menu-mobile .menu_plus:hover {
    background-color: #ff6f08;
}

#menu-mobile .menu_plus:after {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 14px;
    height: 14px;
    content: '';
    background: url(../grafika/ico_plus.png);
    opacity: 1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#menu-mobile .menu_plus:hover:after,
#menu-mobile .menu_plus.active:after {
    opacity: 0;
}

#menu-mobile .menu_plus:before {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) rotate(90deg);
    width: 14px;
    height: 12px;
    content: '';
    background: url(../grafika/arrow_menu.png);
    opacity: 0;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#menu-mobile .menu_plus:hover:before,
#menu-mobile .menu_plus.active:before {
    opacity: 1;
}

#menu-mobile .menu_plus.active:before {
    transform: translate(-50%,-50%) rotate(-90deg);
}

#menu-mobile .menu_2,
#menu-mobile .menu_3 {
    display: none;
    position: relative;
    left: 0;
    bottom: 0;
}

.toggle_container {
    margin: 0;
    overflow: hidden;
    width: auto;
    position: relative;
    display: none;
}

/* --- slider_wraper --- */

#slider_container {
    position: relative;
    overflow: hidden;  
    width: 100vw;
    max-width: 100%;
    top: 0;
    left: 0;
    height: 100vh;
    max-height: 1200px;
    min-height: 599px;
    /*width: 100%;*/
}

.slide {
    position: relative;   
    background-size: cover;
    max-height: 1200px;
    height: 100vh;
    width: 100vw;
    /*max-width: 100%;*/
    overflow: hidden;
    min-height: 599px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#slider_container .text {
    color: #fff;
    font: 700 136px/128px 'Cairo', sans-serif;
    display: block;
}

#slider_container .pasek {
    width: 100%;
    height: 6px;
    border-radius: 3px;
    position: relative;
    background-color: #eaeaea;
    margin: 50px 0 75px;
}

#slider_container .pasek span {
    position: absolute;
    left: 0;
    top: 0;
    height: 6px;
    width: 18%;
    border-radius: 3px;
    background-color: #ec6707;
    margin-left: -1px;
}

#slider_container .pasek_loga {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 50px;
}

#slider_container .pasek_loga img:nth-of-type(1) {
    width: 277px;
    height: 46px;
}

#slider_container .pasek_loga img:nth-of-type(2) {
    width: 333px;
    height: 34px;
}

#slider_container .pasek_loga img:nth-of-type(3) {
    width: 206px;
    height: 46px;
}
#slider_container .pasek_loga img:nth-of-type(4) {
    width: 206px;
    height: 46px;
}

#slider_container .pasek_2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#slider_container .pasek_2 img {
    width: 227px;
    height: 50px;
    margin-right: 60px;
}

#slider_container .text_small {
    color: #fff;
    font: 400 30px/30px 'Cairo', sans-serif;
    display: block;
}

#slider_container .pasek_2 .button {
    margin: 0 0 0 auto;
}

#tobottom {
    position: absolute;
    left: 50%;
    bottom: 40px;
    transform: translate(-50%,0);
    width: 44px;
    height: 44px;
    background: #fff;
    border-radius: 100%;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    z-index: 5;
}

#tobottom:hover {
    background: #ec6707;
}

#tobottom:after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) rotate(180deg);
    width: 21px;
    height: 24px;
    background: url(../grafika/arrow_orange.png);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#tobottom:hover:after {
    background: url(../grafika/arrow_white.png);
    top: 65%;
}

#nav_pag {
    position: absolute;
    right: 60px;
    bottom: 40px;
    z-index: 5;
}

#pag {
    display: flex;
    align-items: center;
}

#pag a {
    width: 12px;
    height: 12px;
    background-color: #fff;
    border: 2px solid #fff; 
    border-radius: 100%;
    text-indent: -9999px;
    margin-left: 15px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#pag a.selected, 
#pag a:hover {
    border: 2px solid #ec6707;
    background-color: transparent;
}

/* --- bannerek na podstronach --- */

#wrapper_container {
    position: relative;
    left: 0;
    top: 0;
    height: 190px;
    width: 100%;
    background: url(../grafika/baner.jpg) 50% 25%;
}

/* --- breadcrumps --- */

#breadcrumps {
    position: absolute;
    padding: 0 50px;
    bottom: 30px;
    display: flex;
}

#breadcrumps > div {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

#breadcrumps div img {
    margin-right: 15px;
    width: 10px;
    height: 11px;
    background-size: 10px 11px;
    transform: rotate(90deg);
}

#breadcrumps a,
#breadcrumps .active{
    font: 600 13px/15px 'Cairo', sans-serif;
    color: #ec6707;
    text-transform: uppercase;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    margin-right: 15px;
}

#breadcrumps a:hover,
#breadcrumps .active {
    color: #c0c0c0;
    cursor: pointer;
}

/* ---- strona głowna --- */

#section_1 {
    padding: 100px 0 120px;
    display: flex;
    justify-content: center;
    position: relative;
}

#section_1 .button {
    position: absolute;
    bottom: 0;
    transform: translate(0,50%);
}

#section_1 .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#section_1 .col {
    width: 44.5%;
    display: flex;
}

#section_1 .col_1 {
    flex-wrap: wrap;
    justify-content: space-between;
}

#section_1 .col_1 img,
#section_1 .col_2 img {
    width: 100px;
    height: 116px;
}

#section_1 .col_1 .lata {
    color: #182b39;
    font: 700 85px/92px 'Cairo', sans-serif;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#section_1 .col_1 .pasek {
    width: 100%;
    height: 6px;
    border-radius: 3px;
    position: relative;
    background-color: #eaeaea;
}

#section_1 .col_1 .pasek span {
    position: absolute;
    left: 0;
    top: 0;
    height: 6px;
    width: 0;
    border-radius: 3px;
    background-color: #ec6707;
    margin-left: -1px;
    -webkit-transition: all 4s;
    -moz-transition: all 4s;
    transition: all 4s;
}

#section_1 .col_1 .pasek span.active {
    width: 65%;
}

#section_1 .home_text {
    margin-top: 35px;
}

#section_1 .col_2 .kolumna_1,
#section_1 .col_2 .kolumna_2 {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#section_1 .col_2 .kolumna_1 {
    align-items: flex-end;
}

#section_1 .col_2 .kolumna_2 {
    align-items: flex-start;
}

#section_1 .col_2 .home_text2 {
    text-align: right;
}

#section_1 .col_2 .kolumna_1 .c_black {
    font: 700 43px/43px 'Cairo', sans-serif;
}


#section_1 .col_2 .kolumna_1 .c_orange {
    font: 700 85px/85px 'Cairo', sans-serif;
}

.separator_pionowy {
    width: 6px;
    height: auto;
    margin: 0 50px;
    border-radius: 3px;
    position: relative;
    background-color: #eaeaea;
    flex: 0 0 auto;
}

.separator_pionowy span {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 0;
    width: 100%;
    border-radius: 3px;
    background-color: #ec6707;
    -webkit-transition: all 4s;
    -moz-transition: all 4s;
    transition: all 4s;
}

.separator_pionowy span.active {
    height: 70%;
}

#section_2 {
    padding: 125px 0 85px;
    display: flex;
    justify-content: center;
    background-color: #f4f4f4;
}

#section_2 .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#section_2 .col_1 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

#section_2 .c_black {
    font: 700 52px/52px 'Cairo', sans-serif;
}

#section_2 .c_orange {
    font: 700 122px/122px 'Cairo', sans-serif;
}

#section_2 .home_text {
    margin: 45px 0;
}

#section_2 .separator_pionowy {
    height: 100%;
    background-color: #fff;
    margin: 0 80px 0 50px;
}

#section_2 .separator_pionowy span {
    height: 0;
    -webkit-transition: all 4s;
    -moz-transition: all 4s;
    transition: all 4s;
}

#section_2 .separator_pionowy span.active {
    height: 70%;
}

#section_2 img {
    width: 250px;
    height: 291px;
    flex: 0 0 auto;
}

#section_3 {
    padding: 80px 0 70px;
    display: flex;
    justify-content: center;
}

#section_3 .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#section_3 .box_ikona {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 27%;
    position: relative;
    padding-bottom: 70px;
}

#section_3 .naglowek {
    color: #182b39;
    font: 400 36px/36px 'Cairo', sans-serif;
    height: 36px;
    overflow: hidden;
    margin-bottom: 30px;
    padding-top: 150px;
    position: relative;
    display: block;
    box-sizing: content-box;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#section_3 .box_ikona:hover .naglowek {
    color: #ec6707;
}

#section_3 .naglowek:before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%,0);
    width: 110px;
    height: 110px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#section_3 .box_1 .naglowek:before {
    background: url(../grafika/ikona_pieniadz.png) no-repeat ;
}

#section_3 .box_2 .naglowek:before {
    background: url(../grafika/ikona_beczki.png) no-repeat;
}

#section_3 .box_3 .naglowek:before {
    background: url(../grafika/ikona_serwis.png) no-repeat;
}

#section_3 .box_ikona:hover .naglowek:before {
    top: 20px;
}

#section_3 .home_text {
    display: block;
    height: 64px;
    overflow: hidden;
    text-align: center;
}

#section_3 .box_ikona:after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%,0);
    width: 21px;
    height: 24px;
    background: url(../grafika/arrow_grey.png);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#section_3 .box_ikona:hover:after {
    background: url(../grafika/arrow_orange.png);
    bottom: 25px;
}

/* --- parallax --- */

#parallax {
    background: url(../grafika/parallax.png) no-repeat;
    background-color: #f4f4f4; 
    height: 540px;
    width: 100%;
    display: flex;
    justify-content: center;
}

#parallax .container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

#parallax .box_parallax {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    z-index: 1;
}

#parallax .parallax_text {
    font: 400 44px/66px 'Cairo', sans-serif;
}

#parallax .c_orange {
    font-weight: 700;
}

#parallax .home_text {
    margin: 25px 0 40px;
}

/* --- dane kontaktowe --- */

#dane_kontaktowe {
    display: flex;
    justify-content: center;
    padding: 55px 0;
}

#dane_kontaktowe .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#dane_kontaktowe .kontakt {
    color: #182b39;
    font: 700 21px/26px 'Cairo', sans-serif;
    position: relative;
}

#dane_kontaktowe .kontakt .home_text {
    line-height: 26px;
}

#dane_kontaktowe .kontakt_adres {
    padding-left: 45px;
}

#dane_kontaktowe .kontakt_telefon {
    padding-left: 65px;
}

#dane_kontaktowe .kontakt_mail {
    padding-left: 59px;
}

#dane_kontaktowe .kontakt:before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0,-50%);
}

#dane_kontaktowe .kontakt_adres:before {
    width: 25px;
    height: 45px;
    background: url(../grafika/ico_adres.png);
}

#dane_kontaktowe .kontakt_telefon:before {
    width: 45px;
    height: 45px;
    background: url(../grafika/ico_tel.png);
}

#dane_kontaktowe .kontakt_mail:before {
    width: 39px;
    height: 45px;
    background: url(../grafika/ico_mail.png);
}

#map {
    width: 100%;
    height: 455px;
}

#map iframe {
    width: 100%;
    height: 100%;
}

#stopka {
    display: flex;
    justify-content: center;
    padding: 20px 0;
    background: #edebe8;
}

#stopka .container {
    display: flex;
    justify-content: space-between;
}

#stopka .stopka_text {
    color: #878582;
    font: 300 10px/10px 'Cairo', sans-serif;
}

/* ---- totop --- */

#totop {
    width: 50px;
    height: 50px;
    border-radius: 100%;
    border: 2px solid #ec6707;
    position: fixed;
    bottom: 30px;
    right: 60px;
    z-index: 10;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#totop:before {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    content: '';
    width: 21px;
    height: 24px;
    background: url(../grafika/arrow_orange.png);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

#totop:hover {
    background: #ec6707;
}

#totop:hover:before {
    background: url(../grafika/arrow_white.png);
}

/* -------- tabela w kontakt --------- */

#table_kontakt {
    border-collapse: collapse;
    background: #fff;
    text-align: left;
    width: 100% !important;
    display: table !important;
    margin: 0;
}

#table_kontakt td {
    border: none;
    text-align: left;
    padding: 0;
    vertical-align: top;
}

#table_kontakt td:first-of-type {
    padding-right: 80px;
    width: 560px;
}

#table_kontakt td:last-of-type {
    width: 740px;
}

#table_kontakt iframe {
    width: 100%;
}

#table_kontakt hr:last-of-type {
    display: block;
    margin-bottom: 0;
}

/* ------ formularz kontaktowy --------*/

#formularz_kontaktowy {
    margin-bottom: 50px;
}

#formularz_kontaktowy h3 {
    margin-top: 45px;
}

.form_text {
    font: 400 15px/32px 'Cairo', sans-serif;
    color: #656869;
    margin-bottom: 15px;
}

.form_text span {
    color: #ec6707;
}

#formularz_kontaktowy input,
#formularz_kontaktowy textarea {
    border: 1px solid #e3e1e1;
    border-radius: 25px;
    padding: 8px 15px;
    font: 400 15px/32px 'Cairo', sans-serif;
    color: #656869;
}

#formularz_kontaktowy input:focus,
#formularz_kontaktowy input:hover,
#formularz_kontaktowy textarea:focus,
#formularz_kontaktowy textarea:hover {
    border: 1px solid #ec6707;
}

#formularz_kontaktowy .formularz_box1 {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

#formularz_kontaktowy .formularz_box1 input {
    box-sizing: border-box;
    width: 280px;
    height: 50px;
}

#formularz_kontaktowy .formularz_box1 div,
#formularz_kontaktowy .formularz_box2 .textarea {
    display: flex;
    flex-direction: column;
}

#formularz_kontaktowy .formularz_box2 {
    display: flex;
    justify-content: space-between;
}

.formularz_box2_kolumna1 {
    display: flex;
    flex-direction: column;
    width: 960px;
}

#formularz_kontaktowy .formularz_box2 textarea {
    box-sizing: border-box;
    width: 100%;
    height: 185px;
    margin-bottom: 40px;
}

#formularz_kontaktowy .formularz_box2 .zgoda {
    display: flex;
    align-items: flex-start
}

#formularz_kontaktowy .formularz_box2 .zgoda .form_text_small {
    margin: -4px 0 0 20px;
    font: 400 13px/20px 'Cairo', sans-serif;
    color: #656869;
}

#formularz_kontaktowy .zgoda a {
    color: #ec6707;
}

.formularz_box2_kolumna2 {
    display: flex;
    flex-direction: column;
    width: 280px;
}

#formularz_kontaktowy .formularz_box2 .formularz_box2_kolumna2 img {
    width: 90px;
    height: 50px;
    margin: 0;
}

#formularz_kontaktowy .formularz_box2 .formularz_box2_kolumna2 input {
    width: 160px;
    height: 50px;
    text-align: center;
}

.formularz_box2_kolumna2 .token div {
    display: flex;
    justify-content: space-between;
    margin-bottom: 22px;
}

#formularz_kontaktowy .formularz_box2_kolumna2 .token {
    margin-bottom: 5px;
}

#button_send {
    width: 280px;
    text-align: left;
}

/* ----- Cookies ------ */

#ciasteczka {
    display: block;  /* do zmiany na block */
    max-width: 290px;
    height: 81px;
    background: #fff;
    padding: 0 10px;
    position: fixed;
    bottom: 9px;
    left: 0;
    z-index: 9999;
    -webkit-border-radius: 0 40px 40px 0;
    border-radius: 0 40px 40px 0;
    border: 1px solid #E0E0E0;
    overflow: hidden;
    cursor: pointer;
    opacity: .95;
}

#ciasteczka .zawartosc {
    max-width: 300px; /* do zmiany */
}

#ciasteczka p.info {
    margin: 3px 0 0 0;
    font: 300 9px/10px 'Arial';
    text-align: justify;
}

#ciasteczka p strong, #ciasteczka p span {
    font: 600 10px/12px 'Arial';
}

#ciasteczka p a {
    color: #9a7e44;
}

#ciasteczka .zamknij {
    float: right;
    width: 34px;
    height: 35px;
    background: url('../grafika/ico-ok.png') no-repeat;
    display: block;
    overflow: hidden;
    margin: 18px 0 0 9px;
    cursor: pointer;
}

#ciasteczka:hover .zamknij {
    background-position: 0 -36px;
}


/* --- komunikaty --- */

.komunikat_wrapper {
    position: fixed;
    display: flex;
    flex-direction: column;
    align-items: center;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    z-index: 999;
    min-width: 300px;
    left: 50%;
    top: -300px;
    transform: translate(-50%,0);
}

.komunikat_wrapper.open {
    top: 10px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.komunikat {
    position: relative;
    color: #ffffff;
    font: 400 14px/21px "Fira Sans", sans-serif;
    padding: 20px 60px 20px 105px;
    overflow: hidden;
    display: flex;
    align-items: center;
    z-index: 20;
    min-width: 300px;
    min-height: 84px;
    border-radius: 25px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.komunikat_wrapper .komunikat {
    opacity: 0;
    margin-bottom: 10px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.komunikat_wrapper .komunikat.open {
    opacity: 1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.komunikat::before {
    content: '';
    position: absolute;
    left: 20px;
    top: 50%;
    width: 64px;
    height: 64px;
    transform: translate(0,-50%);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}

.komunikat_ok::before {
    background: url('../grafika/ikona-ok.png');
}
.komunikat_ok {
    background-color: #99cc00;
}

.komunikat_uwaga:before {
    background: url('../grafika/ikona-uwaga.png');
}

.komunikat_uwaga {
    background-color: #ED6F00;
}

.komunikat_blad:before {
    background: url('../grafika/ikona-blad.png');
}

.komunikat_blad {
    background-color: #ff0000;
}

.komunikat_info:before {
    background: url('../grafika/ikona-info.png');
}

.komunikat_info {
    background-color: #00A4FF;
}

.komunikat_krzyzyk {
    margin-left: 20px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    width: 20px;
    height: 20px;
    cursor: pointer;
    position: absolute;
    top: 20px;
    right: 20px;
}

.komunikat_krzyzyk:hover {
    transform: rotate(180deg);
}