html{
     font-size: 10px;         
  }  
  body{
    margin: 0;
    background: url(img/tlo-21.jpg)  no-repeat center top;
		background-size: 100%;  /*    */
   
    font-family: arial,tahoma,sans-serif ;
    color: #777;
    
  /*  font: 30px arial;    */  
  }
  #box, #footerBox{
     width: 96rem;    /* 960px;  */     /* 1160px;    1280px;  */  /* */
  }
  #box{
    margin-left: auto;
    margin-right: auto; 
    min-height: 50rem;
  }

  a{
      text-decoration: none;
   }
   
                  #flaga{
                    position: fixed;
                    right: -0.5rem;    /*  1rem;    */
                    top: 14rem;
                    width: 7rem;      /*  4.5 rem */
                    height: 7rem;     /*  4.5 rem */
                    /* box-shadow: 0.5rem -0.5rem 3rem #000;   */  
                  }
                  #flaga img{
                    width: 100%;
                    height: 100%;
                  }
  /*  ------------------  cookies ------------------------  */
     #cookies-info{
		padding: 10px 0px; 
		font-size: 14px; 
		line-height: 22px; 
		border-bottom: 1px solid rgb(211, 208, 208); 
		text-align: center; 
		position: fixed; 
		bottom: 0; 
		color: white;
		background-color: #556;		/*#559;	#efefef; */
		width: 100%; 
		
		z-index: 999;
	  }
	  #cookies-info p{
	    margin:0 auto;
	    padding: 0 5rem;
	    width: 86rem;
	  }
	  
	  #cookies-info a{
		background-color: #67a; 
		padding: 3px 10px; 
		color: #FFF; 
		border-radius: 4px; 
		-moz-border-radius: 4px; 
		-webkit-border-radius: 4px; 
		display: inline-block; 
		margin-left: 10px; 
		text-decoration: none; 
		font-weight: bold;
		cursor: pointer;
	  }  
	  #cookies-info a:hover{
		background-color: #00AFBF; 
	  }
  /*  ------------------  header  ------------------------  */
  #header{
    width: 100%;    /* 960px;   */
    min-height: 20rem;   /* 200px;   */
    margin-bottom: 1rem;    /* 10px; */
  }  
    
  #logo{
        float: left;
        margin-left: 0;
        /* margin-right: auto;     */
        margin-top: 1rem;    /* 10px; 
        width: 16rem;                  */
        width: 19%;
   }
   #logo img{
      width: 100%;
   }
   #menu{
      float: right;
      margin-top: 5rem;   /* 50px;   */
      margin-right: 4rem; /* 40px;  */
   }
                   #selMenu{                    /* select Menu do wersji mobile  */
                      display: none;
                   }
     .kolo{
        width: 8rem;    /*  80px;   */     /*    */
        height: 8rem;    /*  80px;   */
        margin-left: 0.6rem;    /*  6px;      */
        margin-right: 0.6rem;    /*  6px;      */
        /* background: #1caab5;     seledyn   */
    /*    background: #191996;     granat */
        background: rgba(25,25,150, 0.4);
    /*      opacity: 0.7;       */
        border-radius: 50%;   
        border: #7ce3eb 0.2rem solid;          /*     2px       */
       /* padding-top: 10px;             */
        text-align: center;
        display: inline-block;
        transition: background 0.5s;
    }
    /**/
    .kolo p{
       line-height: 5.5rem ;    /*  55px;   */
       color: white;  /* #eef;    */
       font-weight: bold;
       font-size: 1.4rem;      /* 14px;      */
    }
    #menu a:hover div{
        background: #1caab5;
        opacity: 1.0;
        box-shadow: 0.5rem -0.5rem 3rem #fff;            /*  5px -5px 30px #fff;  */   
    }

    #pasek{
        position: absolute;
        z-index: -1;
        left: 0px;
        top: 8.5rem;    /* 85px;    */
        height: 3rem;   /* 30px;   */
        width: 100%;
        background: white;
        opacity: 0.2;
    }
/*  
  #header{
    width: 960px;
    height: 200px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
  }     
  #logo{
        float: left;
        margin-left: 0em;
        //margin-right: auto;
        margin-top: 10px;
    }    
   #menu{
      float: right;
      margin-top: 50px;
      margin-right: 40px;
   }  
       #menu a:hover div{
        background: #1caab5;
        opacity: 1.0;
    }
    #btn1{
        background: #1caab5;
        opacity: 1.0;
    }
    #pasek{
        position: absolute;
        z-index: -1;
        left: 0px;
        top: 85px;
        height: 30px;
        width: 100%;
        background: white;
        opacity: 0.2;
    }  
         */
   /*  --------------------------------  cont  ------------------------  */
      #contBox{
    /*    width: 905px;          960*/
        width: 95%;   /* 94.27%;     905px;  */    /*     960*/
        margin-left: auto;
        margin-right: auto;
        margin-top: -1rem;    /* -10px;  */  
        background: white;  /*   yellow    */
     }
   
   #menuLeft{
      float: left;
      font-size: 1.1rem;    /* 11px;  */
      font-weight: bold;
      text-decoration: none;
      margin-top: 10rem;  /* 100px;  */  /* 80px;           */
      display: block;
      margin-left: -17.5rem;    /* -180px;   */
   }
   #menuLeft ul li{
      display: block;
      padding: 0.1rem;    /* 1px;  */
      border-bottom: 1px solid #ddf;  
   }
   #menuLeft ul li a:hover div{
      background: #1caab5;
      color: white; 
   /*   padding-left: 2rem;   */
   }
   #menuLeft ul li a:visited div{
      color: #1f3bcd;
   }
   #menuLeft ul li a div{
     /* padding: 3px;    */
      padding: .3rem .5rem .2rem .5rem;        /*     padding: 3px 9px 2px 9px;    */
      transition: all 0.5s;
   }
   .btn2podsw{
      background: #1caab5;
      color: white !important;    
   }
   
   #cont b,{
      font-weight: bold;
     /* color: #1f3bcd;    */
   }
   #cont strong{
      font-weight: bold;
      /* color: #1f3bcd; */
   }
   
   /*-----------------------------------------------------------------------*/
      
   #cont{ 
/*       height: 36rem;        360px;     */
      min-height: 50rem;    /* 500px; */
      /* overflow: scroll;   */
      
      margin-left: 25%;   /* 24%  230px;  auto;     */
      margin-right: auto; 
      
 /*     width: 870px;               */
      margin-top: -10rem;   /*  -100px;    */
      padding-top:  10rem;    /*  100px;     */
      padding-bottom: 5rem;   /*  50px;      */  
      
      padding-left: 2.5% ;    /* 25px;    /* 160px;   */
      padding-right: 3%;    /* 30px;    */
              
      background: white;
   }    
   #cont p{
        margin-left: 1%; /*  0.5%;   5px;  */  
        margin-right: 1%; /*  0.5%;  5px;  */ 
         
        font-size: 1.4rem; /*  1em; */        /* 14px ;        */
        text-align: justify;
   } 
   #cont ul{
       list-style-position: outside;        
       text-align: justify;
       margin-left: -1.5rem;    /* -20px;  -2rem;  */
   }                                          
   .bodyTxt1{
        /*   width: 843px;      */
        margin-left: 1%; /*  0.5%;   5px;  */  
        margin-right: 1%; /*  0.5%;  5px;  */ 
         
        font-size: 1.4rem; /*  1em; */        /* 14px ;        */
        text-align: justify;
        clear: right;
       /* background: yellow;    */
    }
   #fotki{
      
   }
          /*      a{  
                    float: left;
                    height: 40px;
                    line-height: 40px;
                    padding-left: 0.8em;
                    padding-right: 0.8em;
                    border-top-left-radius: 8px;
                    border-top-right-radius: 8px;
                    background-color: #42c264;  //#ccc;
                    background-image: linear-gradient(#4fec50, #42c264);
                    }*/
   .fotka{
   /* outline: 1px dotted red;     */
      display: inline-block;
     /* margin-left: 1%; 
      margin-right: 1%;   */
      width: 47.8%;
   }
   .left{
        float: left;
        margin-left: 1%;    /*  0.5%;  */  /*  5px;    */
        margin-right: 0%;
   }
   .right{
        float: right;
        margin-left: 0%;    /*  0.5%;  */  /*  5px;    */
        margin-right: 1%;
   }
   .fotka img{
      width: 100%; 
   } 
     

   /* ------------------  footer  -------------------------  */
     #footer{
        width: 100%;
        min-height: 30rem;    /* 300px;   */
        max-height: 300rem;
        color: #bbb;
        background: #555; 
     }
     #footerBox{
       /*  width: 870px;  */
        height: 20rem;    /* 200px;   */
        
        margin-left: auto;
        margin-right: auto; 
        font-size: 1.4rem;     /* 14px;   */
     }
     #footerBox p{
        line-height: 2.6rem;    /* 26px;   */
     }
     #ikonkiKont{
        margin-top: 4.5rem;   /* 45px;      */
        float: left;                        
        margin-left: 4%;  /* 30px;   */
        
     }
     #ikonkiKont img{
        width:  3rem;
        height: 10.5rem;
     }
     #footAddress{
        margin-top: 2rem;   /*  20px;  */
        margin-left: 2%;    /*  20px;   */
        float: left; 
       /* clear: both;          */
     }
     #menuF{
        float: right;                                                     
        font-size: 1.6rem;    /*  16px;     */
        margin-top: 4rem;   /* 90px;  */
        margin-right: 4rem;
       /*clear: both;        
         border: yellow dotted 1px;*/
     }
     #menuF li{
        display: inline-block;
       
     }
     #menuF li a, #btnfPP a{
        color: rgb(200,200,200);
        padding: 1rem;     /*  10px;   */      
     }
     #menuF li a:hover, #btnfPP a:hover{
       color: rgb(255,255,255);        
    /*     color: #7ce3eb              */
     }
     #btnfPP{
         clear: right;
         text-align: right;
         line-height: 5rem;
         margin-top: 10rem;
         margin-right: 25rem;
         /*border: 1px dotted yellow;*/
     }
     #bottom{
        clear: both;
        border-top: 1px solid #777; 
        margin: 0 4%;   
        
        color: #9a9a9a;     
        
     }
     #footer #bottom #cc{
        float: left;
        line-height: 0px;
        font-size: 1.2Rem;   /*  12px;     */
        
     }
     #footer #bottom #made{
        float: right;
        line-height: 0px;
        font-size: 1.0Rem;   /*  11px;     */
     }/**/
     #made a:link, #made a:visited{
        color: #9a9a9a;
     }
     #made a:hover{
        color: white;
     }
     
     #_this a{
        color: white !important;      
    /*    color: #7ce3eb !important;        */
        font-weight: bold;
     }

     
    #test{
      width: 100%;
      height: 100px;
      background: pink;
      position: absolute;
      top: 150px;
  /*    z-index: -2;        */
    }
    
 /* ---------------------------  MEDIA  --------------------------------------- */
    
/*    @media all and (min-width:480px) and (max-width:768px) {        */
    @media screen and (min-width: 1260px) { 
        html{
       /*  font-size: 10px;        */
            font-size:  12px;   /* 62.5%;  75%;     */    
        }
        #box, #footerBox{
           width: 96rem;    /* 1260px;   */  /*  1160px;  */  /* */
        }    
    }
    @media screen and (max-width: 1260px) { 
        html{
       /*  font-size: 10px;        */
            font-size:  10px;   /* 62.5%;  75%;     */    
        }
        #box, #footerBox{
           width: 96rem;    /* width: 960px; */    /*  1160px;  */  /* */
        }    
    }
    @media screen and (max-width: 960px) { 
        html{
       /*  font-size: 10px;        */
            font-size:  8px;  /* 50%;  75%;     */    
        }
        #box, #footerBox{
           width: 96rem;    /* 760px;  */   /*  1160px;  */  /* */
        }    
    }