html { height: 100%; margin:0 auto; }
body   { width: 100%; height: 100%; margin:0 auto; font-size: 1.1em; font-family: 'Roboto Condensed', 'Roboto', sans-serif; padding: 0px;}

.img { display: inline-block; clear: both; position:relative }
.img-responsive {text-align:center; margin:0 auto; }

#baner {width:100%; height:350px; min-height:350px;  background: url(../komp/baner.jpg) no-repeat center; position: ;  text-align:center;}

#baner_tytul {width: 80%; margin: 0 auto; padding: 9em 0 0 0; color: #FFF; bottom:0px; text-align:center; }
.tytul { text-align:center; font-size:4.2em; padding:0 0 1em 0; font-family:   'Marcellus', Georgia, "Times New Roman", Times, serif; text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.66); position: relative; bottom:0px; text-transform: uppercase }

/* #menu2  {clear: both; text-align: center; float: left; width: 100%; height: auto; margin-top:100px; padding:10px; background-color:rgba(0, 0, 0, 0.6); position: absolute; bottom:6px; }  */

#menu2  { text-align: center; height: auto; margin-top:8px; padding:10px; background-color:rgba(0, 0, 0, 0.6); position: relative; bottom:6px; line-height: 130% }

#cien { clear: both; display:block; width: 100%; position: relative;  height: 40px; margin:0 auto; background-image:url(../komp/cien.jpg); background-position:center; background-repeat:no-repeat}

.inline-link-3 { display: inline-block; position: relative; padding-left: 8px; /* Font styles */ text-decoration: none;  color: #FFF; }
.inline-link-3:hover {color: #F00;}
.inline-link-3:before { content: "\25BA"; display: inline-block; padding-right: 3px; pointer-events: none;}
.inline-link-3:hover:before { color: #FF0;}

.opis {color: #31436C; background-image:url(../res/tlo-projekt.png); background-repeat:no-repeat; background-position:center}
.opis-en {color: #31436C; background-image:url(../res/tlo-projekt-en.png); background-repeat:no-repeat; background-position:center}


#head-news {clear: both; display:block; width:100%; background-color:#e5e5e5; position: relative; top:0px; padding-top:10px; margin-top:10px; margin-bottom:10px; text-align:center;  background: url(../komp/baner2b.jpg) no-repeat top center; }

/*#sekcja-polecamy {clear: both; display:block; width:100%; background-color: #AEB6C9; position: relative; top:0px; padding-top:10px; margin-top:10px; margin-bottom:10px; text-align:center; color: #FFF;  } */

#sekcja-polecamy-pl {clear: both; display:block; width:100%; background-image:url(../res/tlo-beton2pl.jpg); size:cover; background-position:right position: relative; top:0px; padding-top:10px; margin-top:10px; margin-bottom:10px; text-align:center;  }
#sekcja-polecamy-en {clear: both; display:block; width:100%; background-image:url(../res/tlo-beton2en.jpg); size:cover; background-position:right position: relative; top:0px; padding-top:10px; margin-top:10px; margin-bottom:10px; text-align:center;  }


/*  RESPONSIVE VIDEO  */
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.alfa img { filter: alpha(opacity=40); -moz-opacity: 50; -khtml-opacity: 50; opacity: 100; }
:hover.alfa img { filter: alpha(opacity=15); -moz-opacity: 0.4; -khtml-opacity: 0.4; opacity: 0.4; }

a.news  { color: #093659; text-decoration: none; font-weight:bold;  line-height:120%; text-align:left ; font-size: 140%}
a.news:hover  { color: #F00;  text-decoration: none;  font-weight:bold; line-height:120%; text-align:left }
a.news:active  { color: #F00;  text-decoration: none; font-weight:bold;  line-height:120% ; text-align:left}

/*  GRID  */
.section { clear: both; padding: 0px; margin: 0px; }

/*  COLUMN SETUP  */
.col { display: block; float:left; margin: 1% 0 1% 1.6%; }
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before, 
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }
/*  GRID OF THREE  */
.span_3_of_3 { width: 100%; }
.span_2_of_3 { width: 66.13%; }
.span_1_of_3 { width: 32.26%; }

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
	.col {  margin: 1% 0 1% 0%; }
	.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
	.tytul { font-size:2.2em; padding:0 0 2em 0;  }
}


#kontener  { clear: both; width: 70%; height: auto; margin:0 auto;  }


#stopa { clear: both; display:block; width: 100%;  margin:0 auto; background-color:#036; padding-top:20px; padding-bottom:30px; text-align:center; color:#CCC }

div.tloszare, p.tloszare, span.tloszare, li.tloszare { display:block; background-color:#E8E8E8; width: auto; height:auto; padding:10px}

.tytul1 { text-transform: uppercase; text-align:left; font-size:200%; color: #666; text-shadow: 2px 2px 2px rgba(255, 255, 255, 0.66); line-height:110% }
.tytul2 { text-transform: uppercase;  text-align:left; font-size: 160%; color: #CCC; text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.66);   }


/*............................................................................................................................*/
.to-top { text-align:center; }
#scroll-to-top { display:none; position:fixed; bottom:100px; right:20px; opacity:1; }
#scroll-to-top:hover {opacity:0.8; }
.to-top2 { text-align:center; }
#scroll-to-top2 { display: block; position:fixed; bottom:40px; right:20px; opacity:1; }
#scroll-to-top2:hover {opacity:0.8; }

/*............................................................................................................................*/

.news_data    { color: #696969; font-size: 16px; }
.news_tytul { font-size: 28px; font-weight:bold; color: #333; text-shadow: 2px 2px 2px rgba(255, 255, 255, 0.66);   }
.news_tytul2 { font-size: 18px; font-weight:bold; color: #333; text-shadow: 2px 2px 2px rgba(255, 255, 255, 0.66);   }

.tytul3 { color: #333; font-size: 19px; }

a  { font-size: 16px; color: #06C ;text-decoration: none;  }
a:hover   { color: #F00; text-decoration: none }
a:active  { color: #8b4513; text-decoration: none }

a.menu  { color: #CCC; text-decoration: none }
a.menu:hover  { color: yellow;  text-decoration: none }
a.menu:active  { color: yellow;  text-decoration: none }



.foto  { border: solid 1px #a9a9a9 }

li { margin-left: 20px}