@import url(http://fonts.googleapis.com/css?family=Lato:400,100,100italic,300,300italic,400italic,700,700italic&subset=latin,latin-ext);
@import "animate.min.css";


/*  
    font-family: 'Lato', sans-serif;
    font-weight: 400;

*/

* {
    margin: 0;
    padding: 0;
}

html, body {height: 100%;}

html {
  font-size:10px;
  font-family: 'Lato', sans-serif;
}
	
body {
    overflow-x: hidden;
    background-color: #fff;
}

a {
    text-decoration: none;
    color:#54247A;
}

.visibility{
	visibility: hidden;
}

.animated{
	visibility: visible!important;
}

div#empty {
	clear:both;
	height:1px;
}

section#wrap {
    width:100%;
    background-color:#fff;
    background-repeat:no-repeat;
}

section#top {
    width:100%;
    margin:0 auto;
    height: 500px;
    background-color:#fff;
    background-image: url(gfx/schody-betonowe.jpg);
}

section#top-realizacje {
    width:100%;
    margin:0 auto;
    height: 240px;
    background-color:#fff;
    background-image: url(gfx/schody-betonowe.jpg);
}

div#logo-nav {
	height:100px;
	width:1250px;
	margin: 0 auto;
    background-image: url(gfx/schody.png);
    background-repeat: no-repeat;
    height:250px;
    background-position: left 75px;
}

div#ginbud {
    float:right;
    font-size:5rem;
    color:#000;
    font-weight:700;
    padding-top:20px;
}

a.ginbud {color:#000;}

nav {
    margin:0 auto;
    text-transform: uppercase;
    font-weight:600;
    font-size:1.7rem;
    height:50px;
    padding-top:40px;
    padding-left:160px;
    float:left;
}

ul#menu {
	width:600px;
	margin:0 auto;
    display: table; 
    overflow: hidden; 
    font-size:1.7rem; 
    height:40px;
    text-align: left;
}

 ul#menu li {
	margin-top:14px;
	display: inline-block;
}

ul#menu-bottom  li {display: inline-block; margin:20px 0;}


a.menu {color: #000;}
a.menu-top {color: #fff;}

a.menu, a.menu-top {
    text-decoration:none;
    margin: 0 30px;
    transition: all .3s;
    font-weight: 600;
}



a.menu:hover {
    color: #222;
    transition: all .3s;
}

h1 {
	font-size:3.7rem;
	font-weight:300;
	color:#000;
        font-style:italic;
        padding-left: 230px;
        padding-top: 265px;
}

#menuTOP {
    height: 50px;
    background-color: #461E65;
    position: fixed;
    top: -40px; /* = -wysokosc naglowka */
    left:0;
    right: 0;
    opacity: 0;
    transition: all 0.4s;
    z-index:200;
    box-shadow: 0px 5px 12px 0px rgba(25, 30, 32, 0.1);    
}

#menuTOP.visible {
    top: 0;
    opacity: 1;
}

ul.menuTOP {
    width:1250px;
    margin-top:15px;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
    font-size:1.6rem;
    color:#fff;
}

ul.menuTOP li {
	display: inline-block;
        color:#fff;
}

img.logo-small {
	margin-top:-5px;
	margin-bottom:-10px;
	margin-right:340px;
}

section#box {
    width:100%;
}

div#boxes {
    width:1250px;
    margin:-75px auto 0 auto;
}

div#box1, div#box2, div#box3 {
    width:33%;
    height:150px;
    float:left;
    background-repeat: no-repeat;
    background-position: 40px 33px;
}

h2 {
    color:#fff;
    font-size:1.7rem;
    font-weight:300;
    padding:52px 0 52px 160px;
}

div#box1 {
    background-color:#461E65;
    background-image:url(gfx/konstrukcje-schodow.png);
}

div#box2 {
    background-color: #54247A;
    background-image:url(gfx/schody-z-betonu.png);
}

div#box3 {
    background-color: #652C93;
    background-image:url(gfx/beton-barwiony.png);
}

section#about {
    background-color: #fff;
    margin:0 auto;
    width:100%;
}

div.about {
    margin: 80px auto;
    width:1250px; 
    background-color: #fff;
    font-size:1.6rem;
    line-height:2.5rem;
    font-weight:300;
	text-align:justify;
}

div.subject {
	text-align:center;
	margin-bottom:30px;
	margin-top:40px;
	font-size:2.3rem;
	font-weight:300;
	font-style:italic;
	text-transform: uppercase;
}

section#phone-mail, section#social {
    background-image:url(gfx/beton.jpg);
    margin:0 auto;
    width:100%;
}

div.phone-mail {
    margin: 0 auto;
    width:700px; 
    font-weight:300;
}

div.social {
    margin: 0 auto;
    width:500px; 
    font-weight:300;
    text-align:center;
}

a.web {
	font-weight: 500;
	color: #000;
	font-size: 2.5rem;
	}

img.social-img {padding:5px;}

div.mail, div.phone, div.center {
    width:300px;
    text-align:center;
    color:#fff;
    padding:10px;
    background-color: #461E65;
    font-style: italic;
    font-size:2rem;
    transition: all .3s;
}

div.mail {float:left;}
div.phone {float:right;}
a.mail {color:#fff; font-size:2rem;}
div.mail:hover {background-color: #54247A; transition: all .3s;}
div#empty-phone-mail {
	clear:both;
	height:80px;
}

h3 {
    color:#000;
    font-size:3rem;
    text-align:center;
    padding-bottom:30px;
    padding-top:40px;
    font-weight:400;
    letter-spacing: 0.2rem;
    font-style: italic;
}

h4 {
    color:#461e65;
    font-size:2.3rem;
    text-align:center;
    padding-bottom:20px;
    padding-top:20px;
    font-weight:400;
    letter-spacing: 0.2rem;
}


#scroolTOP { display: none;position: fixed; z-index:99999; right: 20px; bottom: 20px;border:0px; }
.gototop_icon_i { width:60px;height:44px; }

section#box-link {
	padding-bottom:80px;
}

div.box-link {
    margin: auto;
    width:1250px; 
    background-color: #fff;
}

ul.boxes-link li{
	margin:5px;
	display: inline-block;
	position:relative;
}

div.schody {
    background-color: #461E65;
    color: #fff;
    padding: 15px;
    position: absolute;
    top: 65px;
    left:35px;
    width:200px;
    text-align:center;
    transition: all .3s;
    font-size:1.8rem;
    font-weight:300;
}

div.schody:hover {background-color: #652C93; transition: all .3s;}

h5 {
    color:#000;
    font-size:2.5rem;
    text-align:center;
    padding-bottom:60px;
    padding-top:80px;
    font-weight:300;
    font-style:italic;
}

section#products {
	width:100%;
}

div.products {
	width:1250px;
	margin:10px auto;
	padding-bottom:80px;
}


.styled-select {
   background: transparent;
   -moz-appearance: none;
   width: 330px;
   padding: 10px;
   font-size: 1.6rem;
   font-family: 'Lato', sans-serif;
   color:#000;
   font-weight: 300;
   line-height: 1;
   border: 0;
   border-radius: 0;
   -webkit-appearance: none;
   appearance: none;
   height: 50px;
   overflow: hidden;
   background: url(gfx/select.jpg) no-repeat right #fff;
   border: 1px solid #eee;
   }


 div.type {
	font-size:1.8rem;
	color:#000;
	font-weight:300;
	padding:20px 0;
	text-transform: uppercase;
	margin:10px 0;
	min-height: 65px;

 }

 div.page-foto {
	width:1250px;
	text-align:center;
	margin-top:50px;
}

img.foto {
	margin:7px;
	height:200px;
}

img.box-img {
	width:100%;
}

div.box-type {
	margin:5px;
	text-align:center;
	width:19%;
	background-color:#F4F4F4;
	display: inline-block;
	padding:30px;
	min-height:200px;
	vertical-align:bottom;
	border:1px solid #652C93;
}

div.box-type-txt {
	font-size:1.7rem;
	font-weight:300;
	color:#000;
	line-height:2.5rem;
	margin-bottom:25px;
	min-height:60px;
	font-style:italic;
}

a.more {
    background-color: #461E65;
    color:#fff;
    font-weight:300;
    padding:10px 30px;
    font-size:1.6rem;
    text-decoration: none;
    transition: all .3s;
}

a.more:hover {
	background-color:#652C93;
	transition: all .3s;
}

a.kontakt-mail {
    background-color: #652C93;
    color:#fff;
    font-weight:300;
    padding:10px 30px;
    font-size:1.8rem;
    text-decoration: none;
    transition: all .3s;
}

a.kontakt-mail:hover {
	background-color:#ccc;
	transition: all .3s;
}


section#contact {
    width:100%;
}

div.contact {
    width:1250px;
    margin:20px auto;
	text-align:center;
}

div.form {
	padding: 30px 0;
	clear:both;
}

div.contact-txt {
	font-size:1.7rem;
	color:#000;
	font-weight:300;
}



section#bottom {
    width:100%;
    background-color: #fff;
    margin:auto;
    clear:both;
}

div.footer {
    font-size:1.1rem;
    color:#777;
    padding-bottom:60px;
    width:1250px;
    margin:-100px auto 0 auto;
    clear:both;
    text-align:left;
}

div.wrap-bottom {
    background-color: #fff;
    margin: 90px auto;
    width:1250px;
    height:150px;
    background-image: url(gfx/schody1.png);
}

div#ginbud-bottom {
    float:left;
    font-size:4rem;
    color:#000;
    font-weight:700;
    margin-top:-60px;
}

ul#menu-bottom {
	margin:0 auto;
        font-size:1.6rem; 
        height:40px;
        text-align: left;
}

a.ginbud-bottom {color:#000; font-size:3.5rem;}




/*------------------------------Formularz-------------------------*/

	.formINFO {
		padding:30px;
		font-size:1.5rem;
		background: url('gfx/i.png') left no-repeat;;
	} 

            input, textarea{
                margin: 5px 0;
                border:1px solid #ccc;
                -webkit-appearance: none;
                -moz-appearance: none;
                background-color:#fff;
                font-size:1.5rem;
				font-family: 'Lato', sans-serif;
                font-weight: 300;
            }
            
            textarea{
                width:99%;
                height: 154px;
				padding:10px;
                font-family: 'Lato', sans-serif;
                font-weight: 300;
            }

	    input {padding:6px;}

            input[type=text] {
                width:100%;
                height: 25px;
            }
            input:focus, textarea:focus, select:focus {
                outline-color: #ccc;
                background-color:#fff;
            }
           
            input[type=submit] {
                background: #FE67B4;
                color: #fff;
                text-transform: uppercase;
                padding: 5px 15px;
				border:0px;
                font-size:1.4rem;
                cursor:pointer;
            }
            
            input[type=reset] {
                background: #FE67B4;
                color: #fff;
                text-transform: uppercase;
                padding: 5px 15px;
                margin-left: 10px;
				border:0px;
                font-size:1.4rem;
                cursor:pointer;
            }


/*! SLIDESHOW */
/*! http://responsiveslides.com v1.54 by @viljamis */

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }
  
.rslides_container {
  margin-bottom: 50px;
  margin-top:35px;
  position: relative;
  float: left;
  width: 100%;
  }

.centered-btns_nav {
  z-index: 3;
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 50%;
  left: 0;
  opacity: 1;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 91px;
  width: 48px;
  background: transparent url("gfx/themes.png") no-repeat left top;
  margin-top: -45px;
  }

.centered-btns_nav:active {
  opacity: 1.0;
  }

.centered-btns_nav.next {
  left: auto;
  background-position: right top;
  right: 0;
  }

.centered-btns_nav:focus {
  outline: none;
  }

.centered-btns_tabs {
  margin-top: 10px;
  text-align: center;
  }

.centered-btns_tabs li {
  display: inline;
  float: none;
  _float: left;
  *float: left;
  margin-right: 5px;
  }

.centered-btns_tabs a {
  text-indent: -9999px;
  overflow: hidden;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background: #ccc;
  background: rgba(0,0,0, .2);
  display: inline-block;
  _display: block;
  *display: block;
  -webkit-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
  -moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
  box-shadow: inset 0 0 2px 0 rgba(0,0,0,.3);
  width: 9px;
  height: 9px;
  }

.centered-btns_here a {
  background: #183873;
  background: rgba(0,0,0, .8);
  }


@media screen and (min-width: 1250px)
	      and (max-width: 1400px)
	{
			section#top {height: 380px; background-image: url(gfx/schody-betonowe1400.jpg);}
			h1 {padding-top:155px}
        }



@media screen and (min-width: 980px)
	      and (max-width: 1249px)
	{
            div#menuTOP, div.wrap-bottom, div#menu-bottom, div.footer, div.products, div.contact, div#logo-nav, div.box-link, div.page-foto {width:100%;}
			section#top {background-image: url(gfx/schody-betonowe1250.jpg); height: 420px;}
			h1 {padding-left: 150px; padding-top: 180px;}
			nav {padding-left: 30px;}
			div#ginbud {padding-right:15px;}
			ul#menu {width:700px;text-align:center;}
			div#social {width:90%; height:22px;}
			div#boxes {width:98%; text-align:center;}
			div#box1 {background-image:url(gfx/konstrukcje-schodow70x.png);}
			div#box2 {background-image:url(gfx/schody-z-betonu70x.png);}
			div#box3 {background-image:url(gfx/beton-barwiony70x.png);}
			div#box1, div#box2, div#box3 {height:130px; background-position: 30px 33px;}
			h2 {padding: 45px 0 0 120px; text-align:left; font-size:1.6rem;}
			div.about {width:95%; line-height: 2.3rem; margin: 40px auto;}
			div.footer {padding-left:15px;}
			ul.menuTOP {width:750px}
			a.menu, a.menu-top {margin:0 20px;}
			h5 {font-size:2rem;}
			ul.boxes-link {margin:0 auto; width:64%; text-align:center;}
			div.products {text-align:center; margin:0 auto;}	
        }

@media screen and (min-width: 700px)
	      and (max-width: 979px)
	{
            div#menuTOP, div.wrap-bottom, div#menu-bottom, div.footer, div.products, div.contact, div#logo-nav, div.box-link, div.page-foto {width:100%;}
			section#top {background-image: url(gfx/schody-betonowe980.jpg); height:430px;}
			h1 {padding-left: 25px; padding-top:168px; font-size:2.3rem;}
			nav {padding-left: 30px;}
			div#ginbud {padding-right:15px; float:left; padding-left: 175px; padding-top:0;}
			ul#menu {width:700px;text-align:center;}
			div#social {width:90%; height:22px;}
			div#boxes {width:98%; text-align:center;}
			div#box1 {background-image:url(gfx/konstrukcje-schodow60x.png);}
			div#box2 {background-image:url(gfx/schody-z-betonu60x.png);}
			div#box3 {background-image:url(gfx/beton-barwiony60x.png);}
			div#box1, div#box2, div#box3 {height:120px; background-position: 20px 33px;}
			h2 {padding: 28px 0 0 100px; text-align:left; font-size:1.5rem;}
			div.about {width:95%; line-height: 2.3rem; margin: 40px auto;}
			div.footer {padding-left:15px;}
			ul.menuTOP {width:700px}
			a.menu, a.menu-top {margin:0 20px;}
			h5 {font-size:2rem;}
			ul.boxes-link {margin:0 auto; width:64%; text-align:center;}
			div.products {text-align:center; margin:0 auto;}	
			div.phone-mail {width:650px;}
			h3 {font-size: 2.5rem;}
			div.type {font-size:1.8rem;}
			a.more {font-size: 1.5rem;}
        }




@media screen and (min-width: 480px)
	      and (max-width: 699px)
	{
            div#menuTOP, div.wrap-bottom, div#menu-bottom, div.footer, div.products, div.contact, div#logo-nav, div.box-link, div.page-foto {width:100%;}
			section#top {background-image: url(gfx/schody-betonowe700.jpg); height:365px;}
			div#logo-nav {background-image: url("gfx/linia.png");}
			nav {padding-left: 0; float:none;}
			div#ginbud {float:none; text-align: center; padding:0;}
			ul#menu {width:480px;text-align:center;}
			div#social {width:90%; height:22px;}
			div#boxes {width:98%; text-align:center;}
			div#box1, div#box2, div#box3 {background-image:url(gfx/empty.png); height:120px; background-position: 20px 33px;}
			h2 {padding: 25px; text-align:center; font-size:1.5rem;}
			div.about {width:95%; line-height: 2.3rem; margin: 40px auto; font-size:1.5rem;}
			div.footer {padding-left:15px;}
			a.menu, a.menu-top {margin:0 20px;}
			h5 {font-size:2rem;}
			ul.boxes-link {margin:0 auto; width:64%; text-align:center;}
			div.products {text-align:center; margin:0 auto;}	
			div.phone-mail {width:320px;}
			div.mail {background-color:#652C93;}
			h3 {font-size: 2.3rem;}
			div.type {font-size:1.8rem;}
			a.more {font-size: 1.5rem;}
			h1 {display:none;}
			div.box-type {width:30%; padding:20px;}
			ul.menuTOP {width:480px}
        }


@media screen and (min-width: 300px)
	      and (max-width: 479px)
	{
            div#menuTOP, div.wrap-bottom, div#menu-bottom, div.footer, div.products, div.contact, div#logo-nav, div.box-link, div.page-foto {width:100%;}
			section#top {background-image: url(gfx/schody-betonowe700.jpg); height:365px;}
			div#logo-nav {background-image: url("gfx/linia.png");}
			nav {padding-left: 0; float:none;}
			div#ginbud {float:none; text-align: center; padding:0; margin-top: -70px;}
			ul#menu {width:300px;text-align:center; margin-top:70px; color:#461E65; background-color:#461E65;}
			ul#menu li {width:100%;margin-bottom: 14px;}
			div#social {width:90%; height:22px;}
			h2 {padding: 25px; text-align:center; font-size:1.5rem;}
			div.about {width:95%; line-height: 2.3rem; margin: 40px auto; font-size:1.5rem;}
			div.footer {padding-left:15px;}
			a.menu, a.menu-top {margin:0 20px; color:#fff;}
			a.menu:hover {color:#ddd;}
			h5 {font-size:1.8rem;}
			ul.boxes-link {margin:0 auto; width:100%; text-align:center;}
			div.products {text-align:center; margin:0 auto;}
			div.schody {font-size:1.6rem;}
			div.phone-mail {width:300px; float:none; font-size:1.8rem;}
			div.mail {background-color:#652C93; float:none; padding:10px 0;}
			div.phone {float:none; padding:10px 0; color:#fff;}
			h3 {font-size: 2.1rem; padding-top:40px;}
			div.type {font-size:1.8rem;}
			a.more {font-size: 1.5rem;}
			h1, div#boxes, div#menuTOP, #scroolTOP, .gototop_icon_i, ul#menu-bottom, div.wrap-bottom {display:none;}
			div.box-type {width:80%; padding:20px;}
			ul.boxes-link li {margin:10px 0}
			section#phone-mail, section#social {background-image: url("gfx/beton1.jpg");}
			div.social {width:300px;}
			div#empty-phone-mail {height: 50px;}
			div.footer {clear:both; margin-top: -50px;}
			section#products {margin-top: 90px;}
      }