/* This CSS file is part of the HTML5 / CSS3 tutorial on http://www.lingulo.com */

/* GLOBAL */
* {
  margin: 0;
}

body
{
        border-top:0 solid #FFFFFF;
        background:#D0D6E1;
        color:#333333;
        font-size: 16px;
        font-family: Dosis, sans-serif;
        /*font-family: 'Open Sans', sans-serif;
        /*background: -webkit-linear-gradient(#90B4CA, #588eb1 , #90B4CA); /* For Safari 5.1 to 6.0 */
        /*background: -o-linear-gradient(#90B4CA, #588eb1, #90B4CA); /* For Opera 11.1 to 12.0 */
        /*background: -moz-linear-gradient(#90B4CA, #588eb1, #90B4CA); /* For Firefox 3.6 to 15 */
        /*background: linear-gradient(#90B4CA, #588eb1 , #90B4CA); /* Standard syntax */
        
        /*background:  url('../images/background.jpg') no-repeat fixed center center; background-size: cover;  */   
}

strong
{
        font-weight:bold;
}
header
{
        position:relative;
        width:auto;
        max-width:1000px;
        margin: 0 auto 0px auto;
        border: 0 solid #000000;
}

article
{
        position:relative;
        width:auto;
        max-width:1000px;
        margin: 0 auto 0px auto;
        border: 0 solid #000000;
}

figcaption strong
{
        border-bottom: 1px solid #D6D0C1;
        padding-bottom:10px;
        margin: 10px 0;
        display:block;
}

figcaption
{
        line-height: 25px;
        font-size:14px;
        width:200px;
}

hr
{
        background-color: #A8DFFD;
        border:0;
        height:1px;
        margin:20px 0;
}
a
{
        text-decoration:none;
        color:inherit;
        transition: color .5s ease;
}
/* GECHU */

fieldset {
          top: 10px;
          position:relative;
          display: block;
          max-width:1000px;
          padding: 10px;
          border: 1px solid #FFFFFF;
          background: #FFFFFF;
          -webkit-border-radius: 5px;
          -moz-border-radius: 5px;
          border-radius: 5px;
          box-shadow:0 0 6px #888888;
}

A.wiecej_aktualnosci:link {COLOR: #000000; FONT-WEIGHT: normal; TEXT-DECORATION: none; font-style: italic; }
A.wiecej_aktualnosci:visited {COLOR: #000000; FONT-WEIGHT: normal; TEXT-DECORATION: none; font-style: italic;}
A.wiecej_aktualnosci:active {COLOR: #000000; FONT-WEIGHT: normal; TEXT-DECORATION: none; font-style: italic;}
A.wiecej_aktualnosci:hover {COLOR: blue; FONT-WEIGHT: normal; TEXT-DECORATION: none; font-style: italic;}


#el08 legend {font-family: Dosis, sans-serif; font-weight: 700; font-size: 25px; color: #FFFFFF; text-shadow:0 0 6px black;} 
#el09 legend {font-family: Dosis, sans-serif; font-weight: 700; font-size: 20px; color: #FFFFFF; text-shadow:0 0 6px black;} 

#menu_podstrony
{
        position:relative;
        width:auto;
        max-width:1000px;
        margin: 0 auto 0px auto;
        border: 0 solid #000000;
        top: -5px;
        
}

#obrazy3 {
        position:relative;
        width:auto;
        max-width:980px;
        margin: 0 auto 0 auto;
        border: 0 solid #00395A;
        background-color: #FFFFFF;       
}
        #obrazy3 .obraz1 {
        float:left; 
        border-right: 1px solid  #D0D6E1; 
        background-color: #FFFFFF;
        width: 325px; }
        
            #obrazy3 .obraz1 p {
            padding: 10px; 
            font-size: 18px;}
        
            #obrazy3 .obraz1 img{
            padding: 10px;
            width: 305px; }

        #obrazy3 .obraz2 {
        float:left; 
        border-right: 1px solid  #D0D6E1; 
        background-color: #FFFFFF;
        width: 325px; }
              
              #obrazy3 .obraz2 p {
              padding: 10px; 
              font-size: 18px;}
              
              #obrazy3 .obraz2 img{
              padding: 10px;
              width: 305px; }

        #obrazy3 .obraz3 {
        float:left; 
        border-right: 0 solid  #D0D6E1; 
        background-color: #FFFFFF;
        width: 325px; }
            
              #obrazy3 .obraz3 p {
              padding: 10px; 
              font-size: 18px;}
            
              #obrazy3 .obraz3 img{
              padding: 10px;
              width: 305px; }
       
#obrazy3_tresc {
        position:relative;
        width:auto;
        max-width:980px;
        margin: 0 auto 0 auto;
        border: 0 solid #00395A;
        padding: 10px;
        font-size:16px;
        line-height: 24px;
        background-color: #FFFFFF; 
        text-align: justify;    
}


#logo_gora
{
		top: 5px;
        position:relative;
        width:auto;
        max-width:1000px;
        margin: 0 auto 0 auto;
        border: 1px solid #FFFFFF;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        box-shadow:0 0 6px white;
        background: #D0D6E1;
        
        /*background: -webkit-linear-gradient(#BED8E7, #90B4CA , #DCEDF7); /* For Safari 5.1 to 6.0 */
        /*background: -o-linear-gradient(#BED8E7, #90B4CA, #DCEDF7); /* For Opera 11.1 to 12.0 */
        /*background: -moz-linear-gradient(#BED8E7, #90B4CA, #DCEDF7); /* For Firefox 3.6 to 15 */
        /*background: linear-gradient(#BED8E7, #90B4CA , #DCEDF7); /* Standard syntax */
}

#logo_gora img {
        width: 980px;
        padding: 10px;
}


#gora_daty
{
		height: 40px;
        position:relative;
        width:auto;
        margin: 0 auto 0 auto;
        border: 0 solid #000000;
        font-size:16px;
        color: #4A463B;
        padding: 10px 5px 0 5px;
        
        -moz-box-shadow:0 5px 5px rgba(182, 182, 182, 0.75);
        -webkit-box-shadow: 0 5px 5px rgba(182, 182, 182, 0.75);
        box-shadow: 0 5px 5px rgba(182, 182, 182, 0.75);
        
        background: #FFFFFF;

       /* background: -webkit-linear-gradient(#00395A, #90B4CA); /* For Safari 5.1 to 6.0 */
       /* background: -o-linear-gradient(#00395A, #90B4CA); /* For Opera 11.1 to 12.0 */
       /* background: -moz-linear-gradient(#00395A, #90B4CA); /* For Firefox 3.6 to 15 */
       /* background: linear-gradient(#00395A, #90B4CA); /* Standard syntax */    
}

#gora_daty .gora_daty_lewa {
		color: white;
        float:left; 
        border: 0 solid  #ccc; 
        width: 80%}
#gora_daty .gora_daty_prawa {
		color: white;
        float:right; 
        border: 0 solid  #ccc;  
        width: 18%; 
        text-align: right;}

#aktualnosci
{
		top: 10px;
        position:relative;
        width:auto;
        max-width:1000px;
        margin: 0 auto 0 auto;
        border: 0 solid #FFFFFF;
}
        
			#aktualnosci .lewe fieldset{
			  position:relative;
			  float:left; 
			  width:450px;
			  padding: 10px;
			  border: 1px solid #FFFFFF;
			}
			
			#aktualnosci .prawe fieldset{
			  position:relative;
			  float:right; 
			  width:500px;
			  padding: 10px;
			  border: 1px solid #FFFFFF;

			}
			#aktualnosci .lewe p, #aktualnosci .prawe p
			{
			padding: 10px;
			background: white;
            font-size: 16px;
            line-height: 24px;
			}

 
 
 #narastajace
{
		top: 10px;
        position:relative;
        width:auto;
        max-width:980px;
        margin: 0 auto 0 auto;
        border: 0 solid #000000;
}

#narastajace p
{
			padding: 5px;
            font-size: 16px;
            line-height: 24px;
}
        
			#narastajace .lewe {
			  position:relative;
			  float:left; 
			  width:220px;
			  padding: 10px;
			  border: 0 solid #000000;
			}
			
			#narastajace .prawe {
			  position:relative;
			  float:right; 
			  width:680px;
			  padding: 10px;
			  border: 0 solid #000000;

			}
			#narastajace .lewe p, #narastajace .prawe p
			{
			padding: 10px;
            font-size: 16px;
            line-height: 24px;
			}
			#narastajace .lewe img
			{
			width: 200px;
			}

			
#narastajace2 p
{
			padding: 5px;
            font-size: 16px;
            line-height: 24px;
}
        
			#narastajace2 .lewe {
			  position:relative;
			  float:left; 
			  width:400px;
			  padding: 10px;
			  border: 1px solid #000000;
			}
			
			#narastajace2 .prawe {
			  position:relative;
			  float:right; 
			  width:420px;
			  padding: 10px;
			  border: 1px solid #000000;

			}
			#narastajace2 .lewe p, #narastajace2 .prawe p
			{
			padding: 10px;
            font-size: 16px;
            line-height: 24px;
			}
			#narastajace2 .lewe img
			{
			width: 390px;
			}
 
        

/* STOPKA STRONY */
#page-wrap {
			min-height: 100%; 
			height: auto !important; 
			height: 100%; 
			margin: 0 auto 0; /* taki jak wysokosc stopki */
			}

/* FOOTER */

footer
{
        position:relative;
        clear:both;
        width:auto;
        height:100px;
}

footer .wrapper
{
        line-height:25px;
        margin: 0 auto;
        padding-top:30px;
        width:auto;
        max-width:1000px;
        font-size:12px;
}

#copyright
{
        background: #FFFFFF;
        height:50px;
        position:absolute;
        bottom:0;
        left:0;
        width:100%;
        
}
#copyright .wrapper
{
        font-family: Dosis, sans-serif;
        padding-top:15px;
        color: black;
        font-size:12px;
        position:relative;
        border: 0 solid black;
}
#copyright .wrapper .social
{
        position:absolute;
        right:0;
        top:15px;
}


/* KONIEC STOPKI */



/* KONIEC GECHU */
/* 4 KOLUMNY GALERIA */
#four_columns
{
        line-height:25px;
        font-family: 'Open Sans', sans-serif;
        clear:both;
        width:auto;
        max-width:900px;
        margin:0 auto;
       
}

#four_columns h2
{
        font-size:20px;
        border-bottom: 1px solid #D6D0C1;
        padding: 20px 0;
        margin-bottom: 20px;
        font-weight: 600;      
}

#four_columns .img-item
{
        float:left;
        margin-right:25px;
}

#four_columns .img-item a
{
        position:relative;
        display:block;
}



.column.midlist ul li
{
        display:block;
        width:auto;
        padding:0 0 10px 25px;
        margin-left: 20px;
        margin-bottom:10px;
        border-bottom: 0px solid #444444;
        background:url(../images/arrowright2.png) left 6px no-repeat;
}





/* MOBILNE MENU STARA STRONA */
#mobileMenu
{
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        display: none;
}

#mobileMenu ul li
{
        display:block;
        background-color: #3F4040;
        color: #fff;
        padding: 12px 0;
        letter-spacing: 0.1em;
        text-align: center;
        text-transform: uppercase;
        border-bottom: 1px solid #121212;
}

.toggleMobile
{
        display: none;
}
/* KONIEC MOBILNE MENU STARA STRONA */


/* MISC */
#clear
{
        clear:both;
}



/* MEDIA QUERIES FOR A RESPONSIVE LAYOUT */

@media (max-width: 1215px)
{
  
		header { max-width:1000px; }
		animowane_menu { max-width:1000px; }
}

@media (max-width: 915px)
{
        #four_columns
        {
                width: 500px;
        }
        #four_columns .img-item:nth-of-type(3), #four_columns .img-item:nth-of-type(4)
        {
                margin-top: 25px;
        }  
        header { max-width:1000px; } 
        animowane_menu { max-width:1000px; }    
}

@media (max-width: 765px)
{
     header { max-width:1000px; }  
     animowane_menu { max-width:1000px; } 
}

@media (max-width: 500px)
{
		header { max-width:1000px; }
		animowane_menu { max-width:1000px; }
		
		#four_columns
        {
                width:auto;
        }
        #four_columns .img-item
        {
                width: 200px;
                float:none;
                margin: 25px auto 0 auto;
        }
        #four_columns h2
        {
                margin: 0 30px;
        }
        
        #four_columns p
        {
        margin: 0 30px;
        }
		
        /* MOBILNE MENU STARA STRONA */
        #mobileMenu
        {
                display: block;
                z-index: 99;
        }
        .toggleMobile
        {
                position: fixed;
                top: 10px;
                left: 10px;
                display: block;
                width: 40px;
                height: 36px;
                cursor: pointer;
                z-index: 999;
        }
        .toggleMobile span.menu1, .toggleMobile span.menu2, .toggleMobile span.menu3
        {
                display: block;
                position: absolute;
                width: 40px;
                height: 8px;
                left: 0;
                background: #858585;
                -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
        .toggleMobile span.menu1
        {
                top: 0;
        }
        .toggleMobile span.menu2
        {
                top: 14px;
        }
        .toggleMobile span.menu3
        {
                top: 28px;
        }
        .toggleMobile.active span.menu1
        {
                top: 14px;
                -webkit-transform: rotate(45deg);
                -moz-transform: rotate(45deg);
                -o-transform: rotate(45deg);
                -ms-transform: rotate(45deg);
                transform: rotate(45deg);
                -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
        .toggleMobile.active span.menu2
        {
                -webkit-transform: rotate(-45deg);
                -moz-transform: rotate(-45deg);
                -o-transform: rotate(-45deg);
                -ms-transform: rotate(-45deg);
                transform: rotate(-45deg);
                -webkit-transition: all 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: all 0.5s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
        .toggleMobile.active span.menu3
        {
                opacity: 0;
                -webkit-transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
                transition: opacity 0.35s cubic-bezier(0.75, 0.25, 0.10, 0.95);
        }
        /* KONIEC MOBILNE MENU STARA STRONA */
        
}

/* KEYFRAMES */

@keyframes stylie-transform-keyframes {
  0% {transform:translateX(30px) translateY(46px) rotate(0deg) translate(-50%, -50%);animation-timing-function: cubic-bezier(.25,.25,.75,.75);}
  100% {transform:translateX(260px) translateY(-150px) rotate(0deg) translate(-50%, -50%);}
}

@keyframes stylie-transform2-keyframes {
  0% {transform:translateX(40px) translateY(40px) rotate(0deg) translate(-50%, -50%);animation-timing-function: cubic-bezier(.25,.25,.75,.75);}
  100% {transform:translateX(50px) translateY(40px) rotate(0deg) translate(-50%, -50%);}
}