/* --- Czcionki ---  */

@font-face
{
    font-family: 'SourceSerif-Light';
    src: url(../fonts/SourceSerifPro-Light.otf);
}
@font-face
{
    font-family: 'SourceSerif-Regular';
    src: url(../fonts/SourceSerifPro-Regular.otf);
    font-weight: 100%;
	font-style: normal;
}
@font-face
{
    font-family: 'SourceSerif-Semibold';
    src: url(../fonts/SourceSerifPro-Semibold.otf);
    font-weight: 100%;
	font-style: normal;
}
@font-face
{
    font-family: 'azo_sans_light';
    src: url(../fonts/Azo_Sans_Light.otf);
}
@font-face
{
    font-family: 'azo_sans_bold';
    src: url(../fonts/Azo_Sans_Bold.otf);
}
@font-face
{
    font-family: 'Azo_Sans_Regular';
    src: url(../fonts/Azo_Sans_Regular.otf);
    font-weight: 100%;
	font-style: normal;
}
@font-face
{
	font-family: 'Pump Demi Bold LET';
    src: url(../fonts/PumpDemiBoldPlain.otf);
	font-weight: 100%;
	font-style: normal;
}

/* --- nagłówek i menu --- */

*{
    margin: 0;
    padding: 0;
    text-decoration: none;
    list-style: none;
}
.wrapper{
    max-width: 1280px;
    position: center;
    margin: 0 auto;
}

.logo{
    background-image: url(../folder/logo.png);
    background-size: contain;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-left: 60px;
    width: 180px;
    height: 64px;
    line-height: 64px;
}
.logo:hover{
    background-image: url(../folder/logo_zloty.png);
}

.navbar{
    width: 100%;
    height: 64px;
    margin: 30px 0;
    font-family: 'azo_sans_light';
    display: flex;
}

.navbar ul{
    float: right;
    display: flex;
    margin-left: auto; 
}

.navbar ul li{
    margin: 0 15px;
    line-height: 64px;
}
.navbar ul ic{
    cursor: pointer;
}
.navbar ul s{
    display: flex;
    margin: 0 30px 0 30px;
}
.navbar ul li a{
    color: #000000;
    text-transform: uppercase;
}
.navbar ul li a:hover{
    color: #B48200;
}
.navbar ul li::after{
    content: '';
    height: 2px;
    width: 0%;
    background: #B48200;
    position: absolute;
    left: 0;
    bottom: -10px;
    transition: 0.5s;
}
.navbar ul li:hover::after{
    width: 0%;
}

.social_1{
    background-image: url(../folder/facebook.png);
    background-size: 60%;
    background-repeat: no-repeat;
    background-position: center;
    width: 62px;
    height: 62px;
    margin: 0 -14px;
}
.social_1:hover{
    background-image: url(../folder/facebook_zloty.png);
}
.social_2{
    background-image: url(../folder/youtube.png);
    background-size: 60%;
    background-repeat: no-repeat;
    background-position: center;
    width: 62px;
    height: 62px;
}
.social_2:hover{
    background-image: url(../folder/youtube_zloty.png);
}
.social_3{
    background-image: url(../folder/instagram.png);
    background-size: 65%;
    background-repeat: no-repeat;
    background-position: center;
    width: 62px;
    height: 62px;
    margin: 0 -10px;
}
.social_3:hover{
    background-image: url(../folder/instagram_zloty.png);
}

/* --- hamburger --- */

#check{
    display: none;
}

.checkbtn{
    display: flex;
    font-size: 35px;
    float: right;
    line-height: 80px;
    margin-right: 40px;
    cursor: pointer;
    display: none;
}

/* --- wideo w tle 480 --- */

#glowna480{
    align-items: center;
    position: relative;
    display: none;
}
#glowna480 video{ 
    width: 1280px;
    height: auto;
} 
#glowna480 .text-box{ 
    position: absolute; 
    top: 45%;
    margin-left: 490px;
    text-align: center;
    width: auto;  
}
a{
    text-decoration: none;
}

/* --- wideo w tle --- */

#glowna{
    align-items: center;
    position: relative;
}
#glowna video{ 
    width: 1280px;
    height: auto;
} 
#glowna .text-box{ 
    position: absolute; 
    top: 45%;
    margin-left: 490px;
    text-align: center;
    width: auto;  
}
a{
    text-decoration: none;
}


/* --- poznajmy_sie --- */

#poznajmy_sie{
    margin: 80px 0;
}

.o_nas{
    display: flex;
}
.o_nas h1{
    font-family: 'SourceSerif-Light';
    color: #1A1A1A;
    font-size: 31px;
}
.o_nas p{
    font-family: 'SourceSerif-Light';
    color: #1A1A1A;
    font-size: 21px;
    margin-bottom: 21px;
    text-align: justify;
}
.linia_1{
    border-bottom: 3.5px solid #B48200;
    width: 90px;
    margin: 15px 0 25px 0;
}

.o_nas_tekst{
    display: block;
    padding-right: 80px;
    position: relative;
    margin: 25px 0;
}

.zdjecie{
    width: 35%;
    margin: 0;
    padding: 0 60px;
}

/* --- portfolio --- */

#portfolio{
    margin: 80px 0;
}

#portfolio h1{
    font-family: 'SourceSerif-Light';
    color: #1A1A1A;
    font-size: 31px;
    text-align: center;
}

#portfolio h2{
    font-family: 'SourceSerif-Light';
    color: #fff;
    font-size: 31px;
    text-align: center;
}

.linia_2{
    border-bottom: 3.5px solid #B48200;
    width: 90px;
    margin: 10px auto 65px auto;
}

.portfolio_blok_wideo{
    display: block;
}

.text_na_obrazku{
    position: relative;
}

.imiona{
    width: 100%;
    line-height: 517px;
    position: absolute;
    opacity: 0;
}

.imiona:hover{
    opacity: 1;
}

.portfolio_blok_wideo img{
    margin: 0 auto;
    width: 90%;
    padding: 0 60px;
    cursor: pointer;
}

.portfolio_blok_wideo:hover{
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */    
   -webkit-filter: grayscale(100%);
   -moz-filter: grayscale(100%);
   -ms-filter: grayscale(100%);
   filter: grayscale(100%);
   filter: gray; /* IE 6-9 */
}

/* --- oferta --- */

#oferta{
    margin: 90px 0;
    padding: 0 60px;
}

#oferta h1{
    font-family: 'SourceSerif-Light';
    color: #1A1A1A;
    font-size: 33px;
    text-align: center;
}

.ozdobnik{
    display: block;
    width: 380px;
    margin: 25px auto 25px auto;
}

.row-oferta{
    display: flex;
    padding-top: 25px;
}

.col-oferta{
    flex-basis: 33%;
    padding: 0 40px;
    text-align: justify;
}

.col-oferta h2{
    font-family: 'SourceSerif-Light';
    color: #1A1A1A;
    font-size: 30px;
    text-align: center;
    font-weight: normal;
}

.col-oferta p1{
    font-family: 'SourceSerif-Light';
    color: #1A1A1A;
    font-size: 20px;
    display: inline-flex;
}

.col-oferta img{
    padding-right: 10px;
    width: 3px;
    vertical-align: 0.25em;
}

.przerwa{
    padding: 3px;
}

.linia_3{
    border-bottom: 3.5px solid #B48200;
    width: 90px;
    margin: 10px auto 38px auto;
}

.c_box_1{
    padding-top: 70px;
    padding-bottom: 20px;
}

.c_box_2{
    padding-top: 43px;
    padding-bottom: 20px;
}


.c_box_3{
    padding-top: 43px;
    padding-bottom: 20px;
}

.cena{
    width: 190px;
    border: 3.5px solid #C2C2C2;
    padding: 5px 0;
    margin: 0 auto;
    border-radius: 25px;
    background: none;
    text-align: center;
}

.cena p1{
    font-family: 'SourceSerif-Light';
    color: #1A1A1A;
    font-size: 19px;
}

.opis_oferta {
    font-family: 'SourceSerif-Light';
}

/* --- informacje --- */

.row-informacje{
    display: flex;
    margin: 0 60px;
}

.col-informacje{
    flex-basis: 33%;
    padding: 20px 40px 40px 40px;
    text-align: center;
    background-color: #F7F7F7;
    border: 3px solid #C2C2C2;
    margin: 0 7px;    
}

.wysrodkowanie_1{
    margin: 0px;
}

.wysrodkowanie_2{
    margin: 0px;
}

.wysrodkowanie_3{
    margin: 0px;
}

.col-informacje h1{
    font-family: 'SourceSerif-Regular';
    color: #000000;
    font-size: 17px;
    text-align: center;
    text-transform: uppercase;
    padding-top: 5px;
    padding-bottom: 25px;
}

.col-informacje p1{
    font-family: 'SourceSerif-Light';
    color: #1A1A1A;
    font-size: 20px;
    display: inline-flex;
}

.odpowiedzi{
    font-family: 'Azo_Sans_Regular';
    color: #1A1A1A;
    font-size: 23px;
    text-align: center;
    display: block;
    width: 800px;
    height: 70px;
    border: 3.5px solid #C2C2C2;
    padding: 5px 0;
    margin: 60px auto;
    border-radius: 40px;
    background: none; 
    cursor: pointer;
}

.odpowiedzi:hover{
    background: #C2C2C2;
    color: #fff;
    outline: 0;
}

/* --- kontakt --- */

#kontakt{
    max-width: 1280px;
    padding-bottom: 80px;
}
#kontakt h1{
    font-family: 'SourceSerif-Light';
    color: #1A1A1A;
    font-size: 31px;
    text-align: center;
} 

.linia_4{
    border-bottom: 3.5px solid #B48200;
    width: 90px;
    margin: 10px auto 38px auto;
}

.row-kontakt{
    display: flex;
    padding-left: 125px;
}

.col-kontakt-1{
    flex-basis: 30%;
}

.col-kontakt-1 p1{
    font-family: 'SourceSerif-Light';
    color: #1A1A1A;
    font-size: 17px;
    line-height: 23px;
}

.col-kontakt-2{
    flex-basis: 50%;
    display: block;
}

.col-kontakt-2-A{
    display: flex;
}

.input-group{
    padding-bottom: 20px;
}

input{
    width: 400px;
    height: 40px;
    border: 3px solid #C2C2C2;
    border-radius: 20px;
    background: none;
    padding-left: 40px;
    font-family: 'SourceSerif-Light';
    color: #8F8F8F;
    font-size: 19px;
    outline: none;
}

textarea{
    max-width: 1280px;
    height: 45px;
    border: 3px solid #C2C2C2;
    border-radius: 20px;
    outline: none;
    background: none;
    padding-left: 40px;
    padding-top: 5px;
    font-family: 'SourceSerif-Light';
    color: #8F8F8F;
    font-size: 19px;
    box-sizing: border-box;
}

.przycisk_wyślij{
    background: #B48200;
    width: 150px;
    height: 50px;
    border-radius: 20px;
    margin-top: 20px;
    border: none;
    outline: none;
    color: #fff;
    font-size: 17px;
    cursor: pointer;
}

.przycisk_wyślij:hover{
    background: #A37204;
}

.wiadomosc-wyslana{
    color: #000000;
}

/* --- stopka --- */

#stopka{
    max-width: 1280px;
    height: 50px;
    background-color: #5C5752;
    line-height: 50px;
}

#stopka a{
    color: white;
}

#stopka p1{
    color: #fff;
    font-family: 'SourceSerif-Light';
    font-size: 15px;
    padding-left: 125px;
}

#stopka p2{
    color: #fff;
    font-family: 'SourceSerif-Light';
    font-size: 15px;
    float: right;
    padding-right: 125px;
}

/* --- faq --- */

.faq{
    padding: 10px 120px 47px 120px;
    text-align: justify;
    width: 900px;
}

.faq h1{
    font-family: 'Azo_Sans_Regular';
    font-size: 15px;
    margin-bottom: 5px;
    margin-top: 20px;
}

.faq p1{
    font-family: 'azo_sans_light';
    font-size: 15px;
    line-height: 27px;
}

.faq p2{
    font-family: 'azo_sans_light';
    font-size: 23px;
}

.faq p3{
    font-family: 'azo_sans_light';
    font-size: 19px;
}

.przerwa_faq{
    height: 30px;
}

.przerwa_faq_n{
    height: 13px;
}

/* --- responsywność --- */

@media only screen and (max-width: 1024px) {
    
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}

/* --- o nas --- */ 
.zdjecie{width: 30%; padding: 0 auto; margin: auto 0;} 
#poznajmy_sie{margin: 50px 0 -20px 0;}
.o_nas p{font-size: 17px; text-align: justify; margin-bottom: 17px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{line-height: 421px;}

/* --- oferta --- */
.col-oferta p1{font-size: 14px;}
.col-oferta h2{font-size: 24px;}
.c_box_1{padding-top: 50px;}
.c_box_2{padding-top: 30px;}
.c_box_3{padding-top: 55px;}
    
/* --- informacje --- */
.col-informacje p1{font-size: 15px;}
.odpowiedzi{width: 700px;}
.odpowiedzi h1{font-size: 22px;}
    
/* --- kontakt --- */

.col-kontakt-1{flex-basis: 35%; padding-bottom: 20px; text-align: left;}
input{width: 87%;}
textarea{max-width: 1024px;}
button{margin: 0; margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- faq --- */

.faq{padding: 10px 100px 47px 100px; width: 824px;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px;}
.faq p1{font-size: 15px;line-height: 27px;}
.faq p2{font-size: 23px;}
.faq p3{font-size: 19px;}
    
}

@media only screen and (max-width: 824px) {

/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: flex;}  
.o_nas_tekst{padding-right: 50px;}
.zdjecie{width: 30%; padding: 0 50px; margin: auto 0;} 
#poznajmy_sie{margin: 50px 0 -20px 0;}
.o_nas p{font-size: 17px; text-align: justify; margin-bottom: 17px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 60%;}
.row-oferta{display: inline-flex; padding-top: 25px;}
.col-oferta{padding: 25px; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 12px;}
.col-oferta h2{font-size: 21px;}
.c_box_1{padding-top: 50px;}
.c_box_2{padding-top: 34px;}
.c_box_3{padding-top: 60px;}
    
/* --- informacje --- */
.row-informacje{display: flex; margin: 0 30px;}
.col-informacje{margin: 9px 8; padding: 10px 20px 20px 20px;}
.col-informacje p1{font-size: 12px; height: 95px;}
.col-informacje h1{font-size: 14px; padding-bottom: 17px;}
.odpowiedzi{width: 600px; font-size: 19px; margin: 50px auto;}
    
/* --- kontakt --- */
.row-kontakt{display: flex; padding: 0 92px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 73%;}
textarea{max-width: 280px;}
button{margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka p1{font-size: 14px; padding-left: 80px;}
#stopka p2{font-size: 14px; padding-right: 125px;}   

/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 743px;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px;}
.faq p1{font-size: 15px;line-height: 27px;}
.faq p2{font-size: 23px;}
.faq p3{font-size: 19px;}

}

@media only screen and (max-width: 812px) {

/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: flex;}  
.o_nas_tekst{padding-right: 50px;}
.zdjecie{width: 30%; padding: 0 50px; margin: auto 0;} 
#poznajmy_sie{margin: 50px 0 -20px 0;}
.o_nas p{font-size: 17px; text-align: justify; margin-bottom: 17px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 60%;}
.row-oferta{display: inline-flex; padding-top: 25px;}
.col-oferta{padding: 12; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 12px;}
.col-oferta h2{font-size: 21px;}
.c_box_1{padding-top: 50px;}
.c_box_2{padding-top: 34px;}
.c_box_3{padding-top: 60px;}
    
/* --- informacje --- */
.row-informacje{display: flex; margin: 0 30px;}
.col-informacje{margin: 9px 8; padding: 10px 20px 20px 20px;}
.col-informacje p1{font-size: 12px;}
.col-informacje h1{font-size: 14px; padding-bottom: 17px;}
.odpowiedzi{width: 600px; font-size: 19px;}
    
/* --- kontakt --- */
.row-kontakt{display: flex; padding: 0 92px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 75%;}
textarea{max-width: 280px;}
button{margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka p1{font-size: 14px; padding-left: 80px;}
#stopka p2{font-size: 14px; padding-right: 125px;} 
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 732px;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px;}
.faq p1{font-size: 15px;line-height: 27px;}
.faq p2{font-size: 23px;}
.faq p3{font-size: 19px;}

}

@media only screen and (max-width: 768px) {

/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: flex;}  
.o_nas_tekst{padding-right: 50px;}
.zdjecie{width: 30%; padding: 0 50px; margin: auto 0;} 
#poznajmy_sie{margin: 50px 0 -20px 0;}
.o_nas p{font-size: 17px; text-align: justify; margin-bottom: 17px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 60%;}
.row-oferta{display: inline-flex; padding-top: 25px;}
.col-oferta{padding: 12px; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 12px;}
.col-oferta h2{font-size: 21px;}
.c_box_1{padding-top: 50px;}
.c_box_2{padding-top: 34px;}
.c_box_3{padding-top: 60px;}
    
/* --- informacje --- */
.row-informacje{display: flex; margin: 0 30px;}
.col-informacje{margin: 9px 8; padding: 10px 20px 20px 20px;}
.col-informacje p1{font-size: 12px; height: 95px;}
.col-informacje h1{font-size: 14px; padding-bottom: 17px;}
.odpowiedzi{width: 600px; font-size: 19px;}
    
/* --- kontakt --- */
.row-kontakt{display: flex; padding: 0 92px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 80%;}
textarea{max-width: 280px;}
button{margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka p1{font-size: 14px; padding-left: 80px;}
#stopka p2{font-size: 14px; padding-right: 125px;} 
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 688px;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px;}
.faq p1{font-size: 15px;line-height: 27px;}
.faq p2{font-size: 23px;}
.faq p3{font-size: 17px;}

}

@media only screen and (max-width: 732px) {

/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: flex;}  
.o_nas_tekst{padding-right: 50px;}
.zdjecie{width: 30%; padding: 0 50px; margin: auto 0;} 
#poznajmy_sie{margin: 50px 0 -20px 0;}
.o_nas p{font-size: 17px; text-align: justify; margin-bottom: 17px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 60%;}
.row-oferta{display: inline-flex; padding-top: 25px;}
.col-oferta{padding: 15px; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 12px;}
.col-oferta h2{font-size: 21px;}
.c_box_1{padding-top: 50px;}
.c_box_2{padding-top: 34px;}
.c_box_3{padding-top: 60px;}
    
/* --- informacje --- */
.row-informacje{display: flex; margin: 0 30px;}
.col-informacje{margin: 9px 8; padding: 10px 20px 20px 20px;}
.col-informacje p1{font-size: 12px;}
.col-informacje h1{font-size: 14px; padding-bottom: 17px;}
.odpowiedzi{width: 600px; font-size: 19px;}
    
/* --- kontakt --- */
.row-kontakt{display: flex; padding: 0 92px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 84%;}
textarea{max-width: 280px;}
button{margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka p1{font-size: 14px; padding-left: 80px;}
#stopka p2{font-size: 14px; padding-right: 125px;} 
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 652px;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px;}
.faq p1{font-size: 15px;line-height: 27px;}
.faq p2{font-size: 23px;}
.faq p3{font-size: 16px;}

}

@media only screen and (max-width: 668px) {
  
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 80px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;}
#poznajmy_sie{margin: 50px 0 50px 0;}
.o_nas p{font-size: 17px; text-align: justify;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0; text-align: left;}
#oferta{margin: 0 100px;padding: 0 40px;}
.col-oferta p1{font-size: 17px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
    
/* --- informacje --- */
.row-informacje{display: block; margin: 50px 120px 0 120px;}
.col-informacje{margin: 20px 0;}
.col-informacje p1{display: block; padding: 0px; font-size: 15px; height: 115px;}
.odpowiedzi{width: 400px; font-size: 15px;}
.wysrodkowanie_2{margin: 25px 0px -25px 0px;}
.wysrodkowanie_3{margin: 10px 0px -10px 0px;}
    
/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 92px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 81%;}
textarea{max-width: 640px;}
button{margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka p1{font-size: 14px; padding-left: 80px;}
#stopka p2{font-size: 14px; padding-right: 100px;} 
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 587px;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px;}
.faq p1{font-size: 15px;line-height: 27px;}
.faq p2{font-size: 23px;}
.faq p3{font-size: 15px;}
    
}

@media only screen and (max-width: 640px) {
  
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 80px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;} 
#poznajmy_sie{margin: 50px 0 50px 0;}
.o_nas p{font-size: 17px; text-align: justify;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0; text-align: left;}
#oferta{margin: 0 100px;padding: 0 40px;}
.col-oferta p1{font-size: 17px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
    
/* --- informacje --- */
.row-informacje{display: block; margin: 50px 120px 0 120px;}
.col-informacje{margin: 20px 0;}
.col-informacje p1{display: block; padding: 0; font-size: 15px;}
.odpowiedzi{width: 400px; font-size: 15px;}
    
/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 92px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 86%;}
textarea{max-width: 640px;}
button{margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka{max-width: 640px;}
#stopka p1{font-size: 14px; padding-left: 30px;}
#stopka p2{font-size: 14px; padding-right: 30px;}
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 560px;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px;}
.faq p1{font-size: 15px;line-height: 27px;}
.faq p2{font-size: 23px;}
.faq p3{font-size: 14px;}
    
}

@media only screen and (max-width: 568px) {
  
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 80px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;}
#poznajmy_sie{margin: 50px 0 50px 0;}
.o_nas p{font-size: 17px; text-align: justify;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0; text-align: left;}
#oferta{margin: 0 100px;padding: 0 40px;}
.col-oferta p1{font-size: 17px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
    
/* --- informacje --- */
.row-informacje{display: block; margin: 50px 100px 0 100px;}
.col-informacje{margin: 20px 0;}
.col-informacje p1{display: block; padding: 0; font-size: 15px}
.odpowiedzi{width: 400px; font-size: 15px; margin: 55px auto;}
    
/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 92px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 88%;}
textarea{max-width: 640px;}
button{margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka p1{font-size: 14px; padding-left: 40px;}
#stopka p2{font-size: 14px; padding-right: 40px;}
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 488px;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px;}
.faq p1{font-size: 15px;line-height: 27px;}
.faq p2{font-size: 23px;}
.faq p3{font-size: 19px;}
    
}

@media only screen and (max-width: 480px) {
  
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
#glowna {display: none;}
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- główna480 --- */
#glowna480 {display:block;}
#glowna480 video{width: 100%;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 40px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;}
#poznajmy_sie{margin: 50px 0 50px 0;}
.o_nas p{font-size: 17px; text-align: justify; margin-bottom: 17px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0 20px; text-align: left;}
#oferta{padding: 0 40px; margin: 0;}
.col-oferta p1{font-size: 17px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
    
/* --- informacje --- */
.row-informacje{display: block; margin: 0 40px;}
.col-informacje{margin: 15px 0;}
.col-informacje p1{font-size: 15px; display: block; padding: 0;}
.odpowiedzi{font-size: 15px; width: 350px;}
    
/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 25px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 89%;}
button{margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka{text-align: center}
#stopka p1{font-size: 14px; padding-left: 0px;}
#stopka p2{display: none;}
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 400px;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px;}
.faq p1{font-size: 15px;line-height: 27px;}
.faq p2{font-size: 23px;}
.faq p3{font-size: 19px;}
    
}

@media only screen and (max-width: 426px) {
  
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 40px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;} 
#poznajmy_sie{margin: 50px 0 50px 0;}
.o_nas p{font-size: 17px; text-align: justify; margin-bottom: 17px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0 20px; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 17px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
    
/* --- informacje --- */
.row-informacje{display: block; margin: 0 40px;}
.col-informacje{margin: 15px 0;}
.col-informacje p1{font-size: 15px; display: block; padding: 0;}
.odpowiedzi{font-size: 15px; width: 350px; margin: 45px auto;}
    
/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 25px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 88%;}
button{margin: 0 auto; margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka{text-align: center}
#stopka p1{font-size: 14px; padding-left: 0px;}
#stopka p2{display: none;}
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 345px; text-align: left;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px; line-height: 25px;}
.faq p1{font-size: 14px;line-height: 27px;}
.faq p2{font-size: 17px;}
.faq p3{font-size: 14px;}
    
}

@media only screen and (max-width: 413px) {
  
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 40px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;} 
#poznajmy_sie{margin: 50px 0 50px 0;}
.o_nas p{font-size: 17px; text-align: justify; margin-bottom: 17px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0 20px; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 17px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
    
/* --- informacje --- */
.row-informacje{display: block; margin: 0 40px;}
.col-informacje{margin: 15px 0;}
.col-informacje p1{font-size: 15px; display: block; padding: 0;}
.odpowiedzi{font-size: 15px; width: 350px; margin: 45px auto;}
    
/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 25px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 88%;}
button{margin: 0 auto; margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka{text-align: center}
#stopka p1{font-size: 14px; padding-left: 0px;}
#stopka p2{display: none;}
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 345px; text-align: left;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px; line-height: 25px;}
.faq p1{font-size: 14px;line-height: 27px;}
.faq p2{font-size: 17px;}
.faq p3{font-size: 14px;}
    
}

@media only screen and (max-width: 394px) {
  
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 40px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;}
#poznajmy_sie{margin: 50px 0 20px 0;}
.o_nas p{font-size: 17px; text-align: justify; margin-bottom: 17px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.opis_oferta {margin: 0 14%;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 17px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
    
/* --- informacje --- */
.row-informacje{display: block; margin: 0 20px;}
.col-informacje{margin: 9px 0;}
.col-informacje p1{font-size: 15px; display: block; padding: 0;}
.odpowiedzi{font-size: 15px; width: 320px; margin: 35px auto;}

/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 25px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 86%;}
button{margin: 0 auto; margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka{text-align: center}
#stopka p1{font-size: 14px; padding-left: 0px;}
#stopka p2{display: none;}
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 295px; text-align: left;}
.faq h1{font-size: 14px; margin-bottom: 5px; margin-top: 20px; line-height: 24px;}
.faq p1{font-size: 13px; line-height: 24px;}
.faq p2{font-size: 15px; }
.faq p3{font-size: 14px;}
    
}

@media only screen and (max-width: 376px) {
  
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
 
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 40px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;}
#poznajmy_sie{margin: 50px 0 20px 0;}
.o_nas p{font-size: 17px; text-align: justify; margin-bottom: 17px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 17px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
    
/* --- informacje --- */
.row-informacje{display: block; margin: 0 20px;}
.col-informacje{margin: 9px 0;}
.col-informacje p1{font-size: 15px; display: block; padding: 0;}
.odpowiedzi{font-size: 15px; width: 320px; margin: 35px auto;}

/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 25px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 86%;}
button{margin: 0 auto; margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka{text-align: center}
#stopka p1{font-size: 14px; padding-left: 0px;}
#stopka p2{display: none;}
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 295px; text-align: left;}
.faq h1{font-size: 14px; margin-bottom: 5px; margin-top: 20px; line-height: 24px;}
.faq p1{font-size: 13px; line-height: 24px;}
.faq p2{font-size: 15px; }
.faq p3{font-size: 14px;}
    
}

@media only screen and (max-width: 360px) {
    
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}
    
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{ width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 40px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;} 
#poznajmy_sie{margin: 50px 0 50px 0;}
.o_nas p{font-size: 16px; text-align: justify; margin-bottom: 16px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 17px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
    
/* --- informacje --- */
.row-informacje{display: block; margin: 0 20px;}
.col-informacje{margin: 12px 0;}
.col-informacje p1{display: block; padding: 0;}
.odpowiedzi{font-size: 15px; width: 320px; margin: 35px auto;}
    
/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 25px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 85%;}
button{margin: 0 auto; margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka{text-align: center}
#stopka p1{font-size: 14px; padding-left: 0px;}
#stopka p2{display: none;}
    
/* --- faq --- */
.faq{padding: 10px 40px 47px 40px; width: 286px; text-align: start;}
.faq h1{font-size: 15px; margin-bottom: 5px; margin-top: 20px; line-height: 24px;}
.faq p1{font-size: 15px; line-height: 24px;}
.faq p2{font-size: 23px; }
.faq p3{font-size: 14px;}
 
}

@media only screen and (max-width: 321px) {
    
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}

    
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{ width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 40px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;} 
#poznajmy_sie{margin: 50px 0 50px 0;}
.o_nas p{font-size: 16px; text-align: justify; margin-bottom: 16px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 16px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
  
/* --- informacje --- */
.row-informacje{display: block; margin: 0 20px;}
.col-informacje{margin: 12px 0;}
.col-informacje p1{display: block; padding: 0;}
.odpowiedzi{font-size: 12px; width: 270px; margin: 25px auto;}
    
/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 25px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 83%;}
button{margin: 0 auto; margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka{text-align: center}
#stopka p1{font-size: 12px; padding-left: 0px;}
#stopka p2{display: none;}   
    
/* --- faq --- */
.faq{padding: 10px 30px 47px 30px; width: 260px;}
.faq h1{font-size: 14px; margin-bottom: 5px; margin-top: 20px; line-height: 24px;}
.faq p1{font-size: 14px; line-height: 24px;}
.faq p2{font-size: 23px; }
.faq p3{font-size: 12px;}
 
}

@media only screen and (max-width: 281px) {
    
/* --- menu --- */
.navbar{display: inline-block; height: auto;}
.checkbtn{display: block; margin-right: 25px; height: 50px; line-height: 50px;}
.navbar ul{display: block;}
ul{width:100%; height: 285px; text-align: center; background-color: #FFF; margin-top: 20px; top: -100%; transition: all .5s;}
.navbar ul li{display: block; line-height: 60px;}
.navbar ul s{display: block; margin-bottom: 10px;}  
.navbar ul ic{display: inline-flex;}
#check:checked ~ ul{display: none; top: 0%;}

    
/* --- główna --- */
.wrapper{max-width: 100%;}
#glowna video{ width: 100%;}
.logo{width: 100%; margin-left: 40px; width: 200px; height: 50px; line-height: 50px;}
    
/* --- o nas --- */
.o_nas{display: block;}  
.o_nas_tekst{padding: 0 40px;}
.zdjecie{width: 80%; padding: 0; margin: 0 auto; display: flex;} 
#poznajmy_sie{margin: 50px 0 50px 0;}
.o_nas p{font-size: 16px; text-align: justify; margin-bottom: 16px;}
    
/* --- portfolio --- */
.portfolio_blok_wideo img{width: 90%; padding: 5px 0; margin: 0 auto;}
.linia_2{margin: 10px auto 35px auto;}
.imiona{display: none;}

/* --- oferta --- */
.ozdobnik{width: 90%;}
.opis_oferta {font-size: 13px;}
.row-oferta{display: block; padding-top: 25px;}
.col-oferta{padding: 0; text-align: left;}
#oferta{padding: 0 40px;}
.col-oferta p1{font-size: 16px;}
.c_box_1, .c_box_2, .c_box_3{padding-top: 30px; padding-bottom: 30px;}
  
/* --- informacje --- */
.row-informacje{display: block; margin: 0 20px;}
.col-informacje{margin: 12px 0;}
.col-informacje p1{display: block; padding: 0;}
.odpowiedzi{font-size: 12px; width: 270px; margin: 25px auto;}
    
/* --- kontakt --- */
.row-kontakt{display: block; padding: 0 25px;}
.col-kontakt-1{flex-basis: 50%; padding-bottom: 20px; text-align: left;}
input{width: 83%;}
button{margin: 0 auto; margin-top: 20px;}
#kontakt{padding-bottom: 40px;}
    
/* --- stopka --- */
#stopka{text-align: center}
#stopka p1{font-size: 12px; padding-left: 0px;}
#stopka p2{display: none;}   
    
/* --- faq --- */
.faq{padding: 10px 30px 47px 30px; width: 260px;}
.faq h1{font-size: 14px; margin-bottom: 5px; margin-top: 20px; line-height: 24px;}
.faq p1{font-size: 14px; line-height: 24px;}
.faq p2{font-size: 23px; }
.faq p3{font-size: 12px;}
 
}

