body{
    background-color: rgb(236, 236, 236);
}
#cookieinfo * {
    margin: 0px;
    padding: 0px;
}

#cookieinfo {
    position: fixed;
    font-size: 12px;
    font-family: Arial, Verdana, sans-serif;
    left: 0px;
    bottom: 0px;
    right: 0px;
    background-color: #323334;
    padding: 20px;
    box-shadow: 0px -1px 3px rgba(0, 0, 0, 0.5);
    z-index: 1000;
}

#cookieinfo h6 {
    font-size: 16px;
    font-weight: bold;
    color: #cdd7da;
    text-shadow: 0px 1px 1px rgba(0, 0, 0, 1);
    margin-bottom: 7px;
}

#cookieinfo p {
    font-size: 12px;
    color: #afb4bc;
    line-height: 1.5em;
    text-shadow: 0px 1px 1px rgba(0, 0, 0, 1);
}

#cookieinfo a {
    display: block;
    position: absolute;
    right: 10px;
    top: 10px;
    width: 22px;
    height: 22px;
    border-radius: 11px;
    line-height: 22px;
    font-size: 12px;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    background-color: #ff6000;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
}

#cookieinfo a:hover {
    background-color: #ff7925;
}
#dwa{
    
    width: 100%;
    height: 100px;
   
    
}
.mail{
text-decoration: none;
color: white;
}
.mailto{
    
    color: orangered;

}
.ofl{
    text-align: left;
    font-size: 70px;
    font-family: Arial, Helvetica, sans-serif;
    padding-top: 100px;
    font-weight: 600;
    padding-left: 15%;
    padding-right: 50%;
}
.ofr{
    text-align: right;
    font-size: 70px;
    font-family: Arial, Helvetica, sans-serif;
    padding-top: 100px;
    font-weight: 600;
    padding-left: 50%;
    padding-right: 15%;
    color: gray;
}
.of{
    text-align: center;
    font-size: 70px;
    font-family: Arial, Helvetica, sans-serif;
    padding-top: 100px;
    font-weight: 600;
   
}
.dwl{

    text-align: left;
    font-size: 20px;
    font-family: Arial, Helvetica, sans-serif;
    padding-left: 15%;
    padding-right: 50%;
   float: left;
}
.dwr{

    text-align: left;
    font-size: 20px;
    font-family: Arial, Helvetica, sans-serif;
    padding-left: 50%;
    padding-right: 15%;
   float: right;
   color: gray;
}
.dw{

    text-align: left;
    font-size: 20px;
    font-family: Arial, Helvetica, sans-serif;
    padding-left: 20%;
    padding-right: 40%;
   float: left;
}
.dwg{

    text-align: right;
    font-size: 20px;
    font-family: Arial, Helvetica, sans-serif;
   
   margin-left:80% ; 
   float: right;
   color: black;
}
.od{
    text-decoration: none;
    color: black;


}

.od:hover{
    text-decoration: none;
    color: red;
}
.e{
    width: 10%;
   
}

.inv{
   text-align: center;
   align-items: center;
    height: 400px;
    float: right;
    margin-right: 10%;
    margin-top: 10%;
    
}

  .menu {
    width: 100%;
    color: black;
    position: fixed;
    padding: 5 5rem;
    display: flex;
  
   font-size: 20px;
    align-items: center;
    size: 10px;
    font-family: Arial;
    text-align: center;
  background-color: white;opacity: 0.8;
  
  
  }
.menu .pu{
    margin: 0 1rem;
    text-decoration: none;
    padding: 2rem  .4rem;
   

}
.pu {
    color: rgb(0, 0, 0);
    text-decoration: none;
   }
   .pu:hover {
    color: rgb(247, 134, 41);
    text-decoration: none;
   }
  .zd{
    width: 400px;
    margin-left: 8%;
    color: black;
     padding: 0 0rem;
     display: flex;
 margin-right: 20%;
     align-items: center;

     font-family: Arial;
     text-align: center;
   }

#trzy{
    background-image: url('1.jpg');
    width: 100%;
    height: 600px;
    background-position: left;
    background-repeat: no-repeat;
  color: white;
    background-size: 40% 80%;
    
}
#cztery{
    background-image: url('99.jpg');
   
    width: 100%;
;
    background-repeat: no-repeat;
  color: white;
    background-size: 50% 70%;
    background-position: left;
    height: 700px;
   text-align: center;

}


.wit{
    font-size: 60px;
    text-align: center;
    float: right;
    font-family: Arial, Helvetica, sans-serif;
    align-items: center;
    padding-right: 5%;
   padding-top: 15%;
   color: black;
   font-weight: 600;
}
.wit2{
    font-size: 20px;
    text-align: center;
    float: right;
    font-family: Arial, Helvetica, sans-serif;
    align-items: center;
    padding-right: 5%;
    padding-top: 15%;
   color: black;
   font-weight: 600;
}
#piec{
    background-image: url('4.jpg');
  background-repeat: no-repeat;
color: white;
  background-size: 45% 80%;
  background-position: right;
  background-color: gray;
    width: 100%;
    height: 800px;

    
}
#piecc{
    background-image: url('4.jpg');
  background-repeat: no-repeat;
color: white;
  background-size: 45% 50%;
  background-position: right;
  background-color: gray;
    width: 100%;
    height: 900px;

    
}
#piecccc{
    background-image: url('99.jpg');
  background-repeat: no-repeat;
color: white;
  background-size: 40% 55%;
  background-position: right;
  background-color: gray;
    width: 100%;
    height: 900px;

    
}
#pieccc{
    background-image: url('8.jpg');
  background-repeat: no-repeat;
color: white;
  background-size: 45% 45%;
  background-position: right;
  background-color: gray;
    width: 100%;
    height: 2500px;

    
}
.tztz{
    text-decoration: none;
    color: rgb(255, 167, 167);
}
.goo{
    width: 20%;
    
}
.aaa{
    width: 10%;
    font-size: 30px;
    height: 50px;
   text-decoration: none;
   text-align: right;
   padding-right: 50px;
 
}
.aaaa{
    width: 10%;
    font-size: 30px;
    height: 50px;
   text-decoration: none;
 text-align: left;
}
.ttt{
    height: 1px;
    
}

table{
   
    border-collapse: collapse;
   
    height: 500px;
    align-items: center;
    text-align: center;
  
}

.oo{
    width: 200px;
    align-items: center;
    text-align: justify;
   
   border-style: solid 5px black;
 
}

.tb{

    text-align: center;
    font-size: 20px;
    font-family: Arial, Helvetica, sans-serif;
    padding-left: 20px;
   padding-right: 20px;
}


td{
    width: 25%;
    
}
tr{
    padding-top: 50px;
}

#eden{
     
    width: 100%;
   
    padding-top: 100px;
  align-items: center;
   
    height: 600px;
   text-align: center;
}
#edenn{
     display: none;
    width: 100%;
   
    padding-top: 100px;
  align-items: center;
   
    height: 600px;
   text-align: center;
}
#cero{
    display: none;
   background-image: url(99.jpg);
    width: 100%;
    background-size: 60% 100%;
    background-repeat: no-repeat;
  align-items: center;
   background-position: center;
    height: 600px;
   text-align: center;
   background-color: rgb(163, 163, 163);
   background-color: rgb(163, 163, 163);

   
}
#ceroo{
    display: none;
   background-image: url(4.jpg);
    width: 100%;
    background-size: 60% 100%;
    background-repeat: no-repeat;
  align-items: center;
   background-position: center;
    height: 600px;
   text-align: center;
   background-color: rgb(163, 163, 163);
   background-color: rgb(163, 163, 163);
 margin-top: 30px;
}
#cerooo{
    display: none;
   background-image: url(1.jpg);
    width: 100%;
    background-size: 60% 100%;
    background-repeat: no-repeat;
  align-items: center;
   background-position: center;
    height: 600px;
   text-align: center;
   background-color: rgb(163, 163, 163);
   background-color: rgb(163, 163, 163);
   margin-top: 30px;
  
}
#ceroooo{
    display: none;
   background-image: url(2.jpg);
    width: 100%;
    background-size: 60% 100%;
    background-repeat: no-repeat;
  align-items: center;
   background-position: center;
    height: 600px;
   text-align: center;
   background-color: rgb(163, 163, 163);
   background-color: rgb(163, 163, 163);
   margin-top: 30px;
  
}
#szesc{
    background-image: url('2.jpg');
    background-repeat: no-repeat;
  color: white;
    background-size: 40% 80%;
    width: 100%;
    height: 600px;
   background-color: gray;
    background-position: right;

 
    }
#siedem{
    
    width: 50%;
    background-color: rgb(44, 118, 168);
    height: 800px;
    float: left;
    
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-size: 50px;
    align-items: center;
    text-align: center;
    color: white;
}

#dziewiec{
    width: 50%;
    background-color:  rgb(44, 118, 168);;
    height: 800px;
    float: right;
    text-align: center;
    align-items: center;
     font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 50px;
    align-items: center;
    text-align: center;
    color: white;
    
}
#dziesiec{
    width: 100%;
    background-color: rgb(146, 58, 23);
    height: 50px;
    float: left;
    text-align: center;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.uw{
    width: 30%;
    padding-top: 100px;
}
.u{
    width: 30%;
    padding-top: 100px;
    float: right;
}

.txt{
    margin-left: auto;
   
    text-align: center;
    color: white;

}
.hh{
    
   
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 50px ;
   
    text-align: center;

   
}
.flag{
    height: 30px;
    padding: 5px;
}
.gg{

    
    margin-left: auto;
  
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 40px ;
    text-align: left;
    padding-left: 25%;
}


    .mm{
      font-size: 40px;
    }
    .uu{
      font-size: 100px;
    }

  /*Formularz*/
    .Formularz
   {
   
    
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  
   margin-left: 50px;
   margin-right: 50px;
   align-items: center;
   text-align: center; 
   }

.input-field
{
    font-size: 20px;
  width: 70%;
    height: 40px;
   
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
background-color: WHITE;
    border: 3px solid white;
    border-radius: 3px;
    outline: none;
    align-items: center;
    text-align: center;
    padding-top: auto;
   
}
.input-field2
{
    font-size: 20px;
  width: 70%;
    height: 100px;
    margin-top: 20px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
background-color: WHITE;
    border: 3px solid white;
    border-radius: 3px;
    outline: none;
    text-align: center; 
    padding-top: auto; 
    white-space: normal !important;
    word-wrap: break-word;
  

}
.textarea-field
{
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    height: 500px;
    padding-top: 50px;
    
    width: 70%;
   
}
.btn
{
    
    border-radius: 3px;
    width: 30%;
    height: 50px;
    
    color:white;
   
   
    
    background-color: rgb(185, 119, 64);
    font-size: 20px;
    border: none;
   
}


@media screen and (max-width: 1600px) 
{.header{
    grid-template-columns: 1fr;
}
.dw{
    font-size: 25px;
    
}
.input-field
{
    font-size: 15px;
  width: 50%;
    height: 35px;
    margin-top: 20px;


 
}
.input-field2
{
    font-size: 15px;
  width: 50%;
    height: 100px;
    margin-top: 20px;


 
}
#dziewiec, #siedem{
    height: 1000px;
}
.btn{
    
       
    width: 30%;
    font-size: 15px
}
}



@media screen and (max-width: 1800px) 
{
 .wit{
        font-size: 45px; 
    }
    .menu{
        font-size: 17px;
    }
    .flag{
        height: 25px;
    }
    .zd{
        width: 230px;
    }
    #cztery{
        background-size: 45% 70%;
    }
    #trzy{
        background-size: 45% 70%;
    }
    #szesc{
        background-size: 45% 70%;
    }
    #dziewiec, #siedem{
        height: 1000px;
    }
    .btn{
    
       
        
        font-size: 16px
    }
}

@media screen and (max-width: 1900px) 
{

    #dziewiec, #siedem{
        height: 1000px;
    }
}

@media screen and (max-width: 1200px) 
{
    .dw{
        font-size: 20px;
    } 
    .of{
        font-size: 45px; 
    } 
    .wit{
        font-size: 25px; 
    }
    
    .flag{
        height: 20px;
    }
    .zd{
        width: 180px;
       
    }
    .menu .pu{
        margin: 0 0rem;
    }
    #dziewiec, #siedem{
        height: 900px;
    }
    
}
   

@media screen and (max-width: 900px) 
{
   
    .gg{
        font-size: 20px; 
    }
    .hh{
        font-size: 35px; 
    }
    .aaaa{
        font-size: 25px;
    }
}
@media screen and (max-width: 1500px) 
{
  
    .wit{
        font-size: 35px; 
    }
    .gg{
        font-size: 30px; 
    }
    .hh{
        font-size: 45px; 
    }
    .menu{
        font-size: 15px;
    }
 
    .flag{
        height: 25px;
    }
    #cztery{
        background-size: 35% 60%;
    }
    #trzy{
        background-size: 35% 60%;
    }
    #szesc{
        background-size:35% 60%;
    }
    .btn{
    
       
        
        font-size: 14px
    }
  
    
    
    
}
@media screen and (max-width: 1400px) 
{
  
    
    .menu{
        font-size: 12px;
    }
    .btn{
    
       
        
        font-size: 13px
    }
    .aaa,.aaaa{
        font-size: 30px;
        height: 30px;
    }
 
  
}
@media screen and (max-width: 1300px) 
{
    .inv{
        height: 300px;
    }
  
    .wit{
        font-size: 30px; 
    }
  
    .flag{
        height: 25px;
    }
    .zd{
        width: 150px;
       
    }
    .menu{
        font-size: 13px;
    }
    #cztery{
        background-size: 30% 50%;
    }
    #trzy{
        background-size: 30% 50%;
    }
    #szesc{
        background-size: 30% 50%;
    }
    .ofr, .ofl, .of{
        font-size: 40px;
    }
    .tb{
        font-size: 15px;
        
    }
    table{
        padding-left: 30px;
        padding-right: 30px;
    }
    .oo1, .oo{
        width: 20%;
    }
  
    .btn{
    
       
        height: 30px;
        
        
        font-size: 15px
    }
}


@media screen and (max-width: 1000px) 
{
  
    .wit{
        font-size: 25px; 
    }
    .gg{
        font-size: 25px; 
    }
    .hh{
        font-size: 40px; 
    }
    .zd{
        width: 100px;
        margin-right: 10%;
    }
    .menu{
        font-size: 10px;
    }
    .flag{
        height: 15px;
    }
    #cztery{
        background-size: 30% 40%;
    }
    #trzy{
        background-size: 30% 40%;
    }
    #szesc{
        background-size: 30% 40%;
    }
    .input-field
    {
        font-size: 10px;
      width: 50%;
        height: 25px;
        margin-top: 15px;
    
    
     
    }
   
    .aaa, .aaaa{
        font-size: 20px;
        height: 10px;
    }
    .tb{
        font-size: 15px;
        padding-left: 25px;
        padding-right: 25px;
    }
    .oo1, .oo{
        width: 15%;
    }
    table{
        padding-left: 25px;
        padding-right: 25px;
    }
    .ofr, .ofl, .of{
        font-size: 30px;
    }
   
    .input-field2
{
    font-size: 21px;
  width: 50%;
    height: 50px;
    margin-top: 10px;
    
}
.btn{
    
    width: 50%;
    height: 30px;
    
   
    font-size: 15px
}

}
@media screen and (max-width: 900px) 
{
    
    .gg{
        font-size: 25px; 
    }
    .hh{
        font-size: 35px; 
    }
    .menu{
        font-size: 9px;
    }
    
    #cztery{
        background: none;
        text-align: center;
        
    }
    #cero{
        display: block;
       
        background-size: 80% 80%;
    }
    #ceroo{
        display: block;
       
        background-size: 80% 80%;
    }
    #cerooo, #ceroooo{
        display: block;
       
        background-size: 80% 80%;
    }
    .inv{
        height: 350px;
        float: none;
        margin-right: 0%;
    }
    
    #trzy{
        background: none;
        text-align: center;
      
    }
    #piecccc{
        background: none;
        text-align: center;
        background-color: gray;
    }
    #szesc{
        background: none;
        text-align: center;
        background-color: gray;
    }
    #piec{
        background: none;
        text-align: center;
        background-color: gray;
    }
    #piecc{
        background: none;
        text-align: center;
        background-color: gray;
    }
    #pieccc{
        background: none;
        text-align: center;
        background-color: gray;
height: 1800px;
    }
    .ofl{
        text-align: center;
        padding-left: 25%;
        padding-right: 25%;
    }
    .ofr{
        text-align: center;
        padding-left: 25%;
        padding-right: 25%;
    }
    .dwr{
float: none;
padding-left: 25%;
        padding-right: 25%;

    }
    .dwl{
        float: none;
        padding-left: 25%;
        padding-right: 25%;
    }
    .input-field
    {
        font-size: 10px;
      width: 50%;
        height: 20px;
        margin-top: 5px;
    
    
     
    }
    
    .input-field2
{
    font-size: 21px;
  width: 50%;
    height: 50px;
    margin-top: 10px;
    
}
.dwr, .dwl, .dw{
    font-size: 15px;
}
.aaa, .aaaa{
    font-size: 15px;
}
}
@media screen and (max-width: 850px) 
{
    
    .gg{
        font-size: 20px; 
    }
    .hh{
        font-size: 30px; 
    }
    .flag{
        height: 15px;
    }
    .zd{
     
        margin-right: 8%;
    }
    #cero{
       
       
        background-size: 70% 70%;
    }
    #ceroo{
       
       
        background-size: 70% 70%;
    }
    #cerooo, #ceroooo{
       
       
        background-size: 70% 70%;
    }

}

@media screen and (max-width: 800px) 
{
    
    .gg{
        font-size: 15px; 
    }
    .hh{
        font-size: 25px; 
    }
    .menu{
        font-size: 8px;
    }
    #cztery{
        background-size: 170% 110%;
    }
    #trzy{
        background-size: 170% 110%;
    }
    .input-field
    {
        font-size: 5px;
      width: 50%;
        height: 15px;
        margin-top: 5px;
    
    
     
    }
    
    #cero{
       
       
        background-size: 70% 70%;
    }
    #ceroo{
       
       
        background-size: 70% 70%;
    }
    #cerooo, #ceroooo{
       
       
        background-size: 70% 70%;
    }

    .aaa, .aaaa{
        font-size: 15px;
    }
    .tb{
        font-size: 12px;
        padding-left: 20px;
        padding-right: 20px;
    }
    .oo1, .oo{
        width: 15%;
    }
    table{
        padding-left: 20px;
        padding-right: 20px;
    }
    .input-field2
{
    font-size: 10px;
  width: 50%;
    height: 45px;
    margin-top: 10px;
    
}

}

@media screen and (max-width: 790px) 
{
    .dw{
        font-size: 15px;
    } 
    .gg{
        font-size: 15px; 
    }
    .hh{
        font-size: 30px; 
    }

    #cero{
       
       
        background-size: 65% 65%;
    }
    #ceroo{
       
       
        background-size: 65% 65%;
    }
    #cerooo, #ceroooo{
       
       
        background-size: 65% 65%;
    }

}
@media screen and (max-width: 750px) 
{
    .aaa, .aaaa{
        font-size: 10px;
        padding-right: 5px;
    }
    .gg{
        font-size: 10px; 
    }
    .hh{
        font-size: 20px; 
    }
    .flag{
        height: 8px;
        padding: 2px;
    }
    .zd{
        width: 100px;
     margin-left: 0%;
        margin-right: 0%;
    }
    #cztery{
        background-size: 150% 150%;
        height: 300px;
        background-image: center;
    }
    #trzy{
        background-size: 200% 110%;
    }
    #szesc{
        background-size: 1000% 110%;
    }
    #cztery{
        background-size: 200% 110%;
    }
    .input-field
    {
        font-size: 10px;
      width: 95%;
        height: 10px;
        margin-top: 5px;
    
    
     
    }
    .aaaa{
        font-size: 10px;
    }
    .tb{
        font-size: 12px;
        
    }
    .oo1, .oo{
        width: 15%;
    }
    table{
        padding-left: 20px;
        padding-right: 20px;
        margin-right: 10px;
    }
    #cero, #ceroooo{
       
       
        background-size: 60% 60%;
    }
    .input-field2
{
    font-size: 10px;
  width: 95%;
    height: 40px;
    margin-top: 10px;
    
}
#dziewiec, #siedem{
    font-size: 10px;
 height: 1000px;
}

.btn{
    
    width: 50%;
    height: 30px;
    
    margin-top: 10px;
    font-size: 10px
}
 
#dziewiec, #siedem{
    height: 600px;
}
#piec, #szesc, #trzy{
    height:800px;
}

#piecccc, #piecc {
    height: 1200px;
}

#pieccc{
    height: 1500px;
}
#eden{
    height: 700px;
    display: none;
}
#edenn{
    display: block;
    height: 900px;
}
.inv{
    height: 200px;
}

}
@media screen and (max-width: 700px) {
    .edenn{
        height: 1000px;
    }
    .inv{
        height: 200px;
    } 
    #piec, #szesc, #trzy{
        height:900px;
    }
    .input-field2
    {
        font-size: 10px;
      width: 100%;
        height: 40px;
        margin-top: 10px;
        
    }
    .input-field
    {
        font-size: 10px;
      width: 100%;
        height: 10px;
        margin-top: 5px;
    
    
     
    }
    #cero{
       
       
        background-size: 80% 55%;
    }
    #ceroo{
       
       
        background-size: 80% 55%;
    }
    #cerooo, #ceroooo{
       
       
        background-size: 80% 55%;
    }
    .aaaa{
        font-size: 5px;
    }
    .btn{
    
        width: 50%;
        height: 30px;
        margin-top: 10px;
       
        font-size: 10px
    }
}

