@import url('https://fonts.googleapis.com/css?family=Muli:300,400,600,700');
@import url('https://fonts.googleapis.com/css?family=Montserrat:200,300,400,700');

body{
	background-color: white;
}

.phone-only{
	display: none !important;
}

.hideme
{
    opacity:0;
}

.hidemeleft
{
    opacity:0;
}

.hidemeup
{
    opacity:0;
}

.hidemeright
{
    opacity:0;
}


/* NAVBAR */

.navbar{
	height: 80px;
	background-color: #262523;
	border: 0;
}

.navbar-brand{
	margin-top: 10px;
}

@media screen and (min-device-width: 0px) and (max-device-width: 991px) { 
    .navbar-brand{
    	width: 174px;
	}
}

.navbar-header button{
	margin-top: 20px;
}

.navbar-toggle .icon-bar {
    display: block;
    width: 26px;
    height: 4px;
    border-radius: 0px;
    background-color: #635337 !important;
}

.navbar-inverse .navbar-toggle{
	border: 0;
}

@media screen and (min-device-width: 0px) and (max-device-width: 991px) { 
    .navbar-collapse{
	background-color: #262523;
	}

	.navbar{
		height: 50px;
	}

	.navbar-brand{
		margin-top: 0;
	}

	.navbar-header button{
		margin-top: 5px;
	}

	.schody-bg{
		margin-top: 40px !important;
	}

	#navbar{
		margin-top: 0 !important;
	}

	.text-box p{
		margin-top: 30px !important;
	}

	.map-head{
		margin-bottom: -40px !important;
	}

	.title-page{
		margin-top: 0 !important;
	}

	.cream-box2{
		height:80px !important;
	}

	.cream-box3{
		top:40px !important;
	}

	.text-box{
		padding-top: 80px !important;
	}

	.margin-podstrona{
		margin-top: 40px !important;
	}

	.lista-boxy-photos{
		display: none;
	}
}


#navbar{
	margin-top: 20px;
}

.nav li{
	font-family: 'Muli', sans-serif;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.nav a{
	color: #5e584c !important;
	transition: 0.5s;
}

.nav a:hover{
	color: #aa9e84 !important;
}

.active a{
	color: #aa9e84 !important;
}

.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover{
	background-color: transparent;
}

/* NAVBAR END */

/* MAIN VIEW */

.schody-bg{
	margin-top: 80px;
	height: 100vh;
	background-image: url('../img/stair-bg.png');
	background-color: #312c29;
	background-size: cover;
	background-position: center;
	-webkit-box-shadow: inset 0px 0px 184px -6px rgba(0,0,0,0.75);
	-moz-box-shadow: inset 0px 0px 184px -6px rgba(0,0,0,0.75);
	box-shadow: inset 0px 0px 184px -6px rgba(0,0,0,0.75);
}

.title-flex-parent {
  display: flex;
  flex-direction: column;
  justify-content: center;
  resize: vertical;
}

.title-page{
  margin-top: -50px;
}

.title-page h1, h3{
	color:white;
}

.title-page h1{
	font-size: 72px;
	text-transform: uppercase;
	font-family: 'Montserrat', sans-serif;
	letter-spacing: 0.1em;
	font-weight: 200;

	text-shadow: 2px 1px 4px rgba(0, 0, 0, 1),
				2px 1px 8px rgba(0, 0, 0, 1),
				2px 1px 15px rgba(0, 0, 0, 1);
}

.title-page h3{
	color:#c6ac8f;
	font-size: 36px;
	letter-spacing: 0.1em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 200;

	text-shadow: 2px 1px 4px rgba(0, 0, 0, 1),
				2px 1px 8px rgba(0, 0, 0, 1),
				2px 1px 15px rgba(0, 0, 0, 1);

	margin-top: 0px;
}

.arrow-down{
	height: 50px;
	width: 50px;
	margin-top: 50px;
	opacity: 0.5;
	transition: 0.8s;
	/*
	animation-name: arrow-down-anim;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    */
}

.arrow-down:hover{
	opacity: 1;
	animation-name: arrow-down-anim;
    animation-duration: 3s;
    animation-iteration-count: infinite;
}

@keyframes arrow-down-anim {
    0% {	height: 50px;
			width: 50px;}
    50% {	height: 70px;
			width: 70px;}
	100% {	height: 50px;
			width: 50px;}
}

/* MAIN END */

.no-padding{
	padding: 0;
}

.left-letter{
	background-color: #f8f8f8;
	height: 760px;
}

.right-text-box{
	background-color: #ffffff;
	height: 760px;
	z-index: -2;
}

.o-flex-parent {
  display: flex;
  justify-content: center;
  resize: vertical;
  flex-direction: column;
  z-index: -2;
}

.literka{
	padding-top: 60px;
	padding-bottom: 60px;

}

.text-box{
	padding-top: 120px;
	padding-bottom: 120px;
	padding-left: 10%;
	padding-right: 18%;
}

.text-box h1{
	text-align: right;
	font-size: 48px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 200;
	color: #100d0a;
}

.text-box h4{
	text-align: right;
	font-size: 25px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 200;
	color: #83725f;
	}

.text-box p{
	font-family: 'Muli', sans-serif;
	font-size: 16px;
	color: #100d0a;
	text-align: justify;
    text-justify: inter-word;
    margin-top: 80px;
}

.cream-box{
	background-color: #ede8de;
	width: 40px;
	height: 60%;
	position: absolute;
	top:0;
	left: 70px;
	z-index: -1;
}

.cream-box2{
	background-color: #f6f2e9;
	width: 40px;
	height: 230px;
	position: absolute;
	top:0;
	left: 20%;
	z-index: -1;
}

.cream-box3{
	background-color: #f6f2e9;
	width: 20%;
	height: 40px;
	position: absolute;
	top:190px;
	left: 0px;
	z-index: -1;
}

@media screen and (min-device-width: 0px) and (max-device-width: 991px) { 
    .text-box{
	padding-right: 10%;
	}
}


/* OFFER */

.offer-bg{
	background-color: #f2f2f2;
	padding-bottom: 60px;
}

.head-offer{
	padding-top: 60px;
}

.head-offer h1{
	font-size: 48px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 200;
	color: #100d0a;
}

.head-offer h4{
	font-size: 25px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 200;
	color: #83725f;
}

.offer-txt p{
	color: #100d0a;
	font-family: 'Muli', sans-serif;
	font-size: 16px;
	text-align: justify;
    text-justify: inter-word;
    padding-top: 80px;
}

@media screen and (min-device-width: 0px) and (max-device-width: 991px) { 
    .offer-txt p{
	padding-top: 30px;
	}

	.arrow-offer {
	margin-top: 20px;
	}
}

#triangle-down {
	position: absolute;
	right: 0px;
	top: 60px;
	width: 0;
	height: 0;
	border-left: 9px solid transparent;
	border-right: 9px solid transparent;
	border-top: 18px solid #cab992;
}

#v-line{
	position: absolute;
	right: 9px;
	top: 0px;
	height: 60px;
	width: 1px;
	background-color: #cab992;
}

#h-line{
	position: absolute;
	right: 9px;
	top: 0px;
	height: 1px;
	width: 100px;
	background-color: #cab992;
}

.arrow-offer{
	height: 200px;
	margin-top: 90px;
}

/* REALIZACA */

.realizacja-bg{
	background-image: url('../img/brown-bg.png');
	background-size: cover;
	/*min-height: 100vh;*/
	padding-left: 10%;
	padding-right: 10%;
}

.slider-bg{
	height:620px;
}

.cell-realizacja{
	height: 700px;
	background-color: red;
	margin-top: 20px;
	margin-top: -100px;
	display: flex;
}

.realizacja-head1{
	background-image: url('../img/schody2.png');
	background-size: cover;
}

.realizacja-head2{
	background-image: url('../img/schody1.png');
	background-size: cover;
}
/*
#myCarousel{
	height:630px;
}
*/
.carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img{
	display: block;
    width: 100%;
    height: 100%;
}

.parent-flex-slider{
	/*display: flex;
	flex-flow: row wrap;*/
  	height: 870px; /* Or whatever */
  	padding-left: 0;
  	justify-content:space-around;
  	width: 100%;
  	float: right;
}

.blocks{
	display: block;
	justify-content:space-between;
	background-color: #3b3833;
	height: 820px;
	width: 470px;
	-webkit-box-shadow: 0px 17px 37px -11px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 17px 37px -11px rgba(0,0,0,0.75);
box-shadow: 0px 17px 37px -11px rgba(0,0,0,0.75);
}
/*
.parent-flex-slider li{
	display: block;
	justify-content:space-between;
	background-color: blue;
	height: 820px;
	width: 470px;

}*/

.box1{
	position: absolute;
	top: -100px;
	right: 100px;
}

.box2{
	position: absolute;
	top: -100px;
	right: 600px;
}

@media screen and (min-device-width: 1190px) and (max-device-width: 1627px) { 
    .box1{
    	right: 0px;
	}

	.box2{
		position: absolute;
		right: 500px;
	}
}

@media screen and (min-device-width: 991px) and (max-device-width: 1190px) { 
    .box1{
    	right: -50px;
	}

	.box2{
		position: absolute;
		right: 450px;
	}

	.realizacja-bg{
		padding-left: 6%;
		padding-right: 6%;
	}
}

@media screen and (min-device-width: 0px) and (max-device-width: 991px) { 
    .box1{
    	left: 0; 
  		right: 0;
  		margin-left: auto; 
  		margin-right: auto;  
	}

	.box2{
		left: 0; 
  		right: 0;
  		margin-left: auto; 
  		margin-right: auto;  
		top: 800px;
	}

	.realizacja-bg{
		padding-left: 0%;
		padding-right: 0%;
		height: 1700px;
	}
}

@media screen and (min-device-width: 0px) and (max-device-width: 470px) {
	.blocks{
	display: block;
	justify-content:space-between;
	background-color: black;
	height: 100px;
	width: 100%;
	}
}



.head-schody{
	background-color: yellow;
	width: 100%;
	height: 190px;
-webkit-box-shadow: 0px 17px 28px -11px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 17px 28px -11px rgba(0,0,0,0.75);
box-shadow: 0px 17px 28px -11px rgba(0,0,0,0.75);
}

.no-padding-margin{
	padding: 0;
	margin: 0;
}

.button-schody{
	position: absolute;
	margin: auto;
	right: 0;
	left:0;
	bottom: 30px;
	width: 160px;
	height: 35px;
	background-color: transparent;
	border: 2px;
	border-style: solid;
	border-color: rgba(255,255,255,0.3);
	color: rgba(255,255,255,0.3);
	font-size: 18px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	text-transform: uppercase;
	z-index: 999999;
	transition: 1s;
	background-color: rgba(0,0,0,0.2);
}

.button-schody:hover{
	border-color: rgba(255,255,255,1);
	color: rgba(255,255,255,1)
}

.carousel-control{
	transition: 1s;
}

.carousel-indicators .active{
	width: 10px;
    height: 2px;
    margin: 1px;
    background-color: rgba(0,0,0,0);
    opacity: 1;

}

.carousel-indicators li{
	display: inline-block;
    width: 10px;
    height: 2px;
    margin: 1px;
    text-indent: -999px;
    cursor: pointer;
    background-color: #000\9;
    background-color: rgba(0,0,0,0);
    border: 1px solid #fff;
    border-radius: 0px;
    opacity: 0.3;
}

.carousel-indicators{
	bottom: 10px;
}

.head-schody h1{
	font-size: 20px;
	color: white;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
}

.head-schody p{
	font-size: 12px;
	color: #ceb8a0;
	font-family: 'Muli', sans-serif;
	font-weight: 300;
}

.head-schody{
	padding-top: 60px;
}

.icon-schody{
	padding-bottom: 20px;
}

.vertical{
    /* Safari */
	-webkit-transform: rotate(-90deg);

	/* Firefox */
	-moz-transform: rotate(-90deg);

	/* IE */
	-ms-transform: rotate(-90deg);

	/* Opera */
	-o-transform: rotate(-90deg);

	/* Internet Explorer */
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

	color: #534839;
	font-family: 'Muli', sans-serif;
	font-weight: 300;
	font-size: 90px;
	position: absolute;
	transition: 0;
	top: 400px;
	left: 0;
	opacity: 0.5;
}

.realizat{
	height: 100%;
}

@media screen and (min-device-width: 1480px) and (max-device-width: 1750px) {

.vertical{
	top: 400px;
	left: -100px;
}
}

@media screen and (min-device-width: 1360px) and (max-device-width: 1480px) {

.vertical{
	top: 400px;
	left: -200px;
}
}

@media screen and (min-device-width: 1259px) and (max-device-width: 1360px) {

.vertical{
	top: 400px;
	left: -280px;
}
}

@media screen and (min-device-width: 0px) and (max-device-width: 1259px) {

.vertical{
	display: none;
}

.realizat{
 	height: initial;
}
}


/* ETAPY PRAC */

.etapy{
	padding-top: 70px;
	padding-bottom: 90px;
	background-color: white;
}

.list-etap{
	list-style: none;
	padding-left: 0;
	padding-top: 35px;
}

.list-etap li{
	margin-bottom: 30px;
	}

.list-box h1{
	font-size: 48px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 200;
	color: #100d0a;
}

.list-box h4{
	font-size: 25px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 200;
	color: #83725f;
	}

.list-box p{
	font-family: 'Muli', sans-serif;
	font-size: 16px;
	color: #100d0a;
	
    
}

.margin-etap{
	margin-top: 50px;
	text-align: justify;
	text-justify: inter-word;
}

.tick{
	height: 25px;
	width: 25px;
	float: left;
	margin-right: 20px;
}

.cream-box4{
	background-color: #f6f2e9;
	width: 40px;
	height: 48px;
	position: absolute;
	bottom: 0px;
}

.prostakat{
	margin-top: -70px;
	height: 200px;
}

.cream-box5{
	background-color: #f6f2e9;
	width: 40px;
	height: 140px;
	position: absolute;
	top: 0;
	left: 0;
}

.cream-box6{
	background-color: #f6f2e9;
	width: 50%;
	height: 40px;
	position: absolute;
	top: 140px;
	left: 0px;
}

.padme{
	margin-bottom: -180px;
}

/* KONTAKT */

.kontakt-box p{
	font-family: 'Muli', sans-serif;
	font-size: 16px;
	color: #100d0a;
	text-align: justify;
    text-justify: inter-word;
}

.kontakt-box h1{

	font-size: 48px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 200;
	color: #100d0a;
}

.kontakt-box h4{

	font-size: 25px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 200;
	color: #83725f;
	}

.kontakte{
	padding-top: 75px;
}

.mar-kot{
	margin-top: 40px;
}

.color{
	color: #83725f;
}

.left-kontakt{
	background-color: #f8f8f8;
	height: 100%;
	padding-top: 40px;
	position-bottom: 40px;
	padding-bottom: 80px;
}

.right-kontakt-box{
	background-color: #ffffff;
	height: 100%;
	z-index: -2;
	padding-bottom: 80px;
	/*min-height: 650px;*/
}

.cream-box7{
	background-color: #f6f2e9;
	width: 90%;
	height: 40px;
	position: absolute;
	top:270px;
	left: 0px;
	z-index: -1;
}

@media screen and (min-device-width: 0px) and (max-device-width: 991px) {

	.cream-box6, .cream-box5, .cream-box4, .cream-box7{
		display: none;
	}

	.prostakat{
		height: 100px;
	}

	.right-kontakt-box{
		padding-left: 80px;
		padding-right: 80px;
		padding-bottom: 80px;
	}

}

#realizacje{
	transition: 10s;
}

.footer{
	background-image: url('../img/footer-bg.png');
	background-size: cover;
	padding-top: 80px;
	padding-bottom: 80px;
	padding-left: 120px;
	padding-right: 120px;
}

.footer-menu{
	display: inline;
	margin-left: 0;
}

.footer-menu li{
	display: initial;
	color: #5e584c;
	font-family: 'Muli', sans-serif;
	font-size: 14px;
	margin-left: 20px;

}

.footer-menu a{
	color: #5e584c;
	font-family: 'Muli', sans-serif;
	font-size: 14px;
}

.footer-logo{
	float: right;
}

.kaczka{
	background-color: #242424;
	padding-top: 10px;
	padding-bottom: 10px;
}

#map{
	height: 400px;
	z-index: -1;
}

.gm-style-mtc, .gmnoprint {
	display: none;
}

.map-head h1{
	font-size: 48px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	color: #5e503f;
	text-shadow: 0px 0px 18px rgba(255, 255, 255, 1);
	margin-bottom: 2px;
}

.map-head h2{
	font-size: 25px;
	letter-spacing: 0.025em;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	color: #c6ac8f;
	margin-top: 0;
	text-shadow: 0px 0px 18px rgba(255, 255, 255, 1);
}

.map-head{
	margin-bottom: -100px;
	height: 0;
}

.zind{
	position: relative;
	z-index: 2;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.margin-podstrona{
	margin-top: 80px;
	min-height: 90vh;
}

.no-pad-ops{
	padding-right: 0;
	padding-left: 0;
}

.opis-schody{
	background-color: rgba(41,39,37,0.8);
	height: 100vh;
	padding-right: 12%;
	padding-left: 3%;
	color: white;
}

.head-schody-opis{
	margin-top: 100px;

}

@media screen and (min-device-width: 1003px) and (max-device-width: 10003px) {

	.lista-boxy-photos{
		width: 200px;

	}
}

.info-sec{
	margin-top: 50px;
	margin-bottom: 50px;
}

.title-head{
	color: #ceb8a0;
	font-family: 'Muli', sans-serif;
	font-size: 30px;
	margin-top:20;
	margin-bottom: 35px;
	width: 220px;
	font-weight: 700;
	text-align: left;
}

.white-tit{
	color: white;
	font-weight: 500;
}

.small-head{
	color: #80746e;
	font-family: 'Muli', sans-serif;
	font-size: 14px;
	margin-bottom: 0;
}

.big-head{
	color: #ceb8a0;
	font-family: 'Muli', sans-serif;
	font-size: 20px;
	margin-top:0;
	margin-bottom: 20px;
	width: 220px;
}

.separator-schody{
	width: 100%;
	height: 1px;
	background-color: #535150;
}

.separator-schody-30-l{
	width: 25%;
	height: 1px;
	background-color: #535150;
	float: left;
}

.separator-schody-30-r{
	width: 25%;
	height: 1px;
	background-color: #535150;
	float: right;
}

.img-schody-pro{
	margin-top: -20px;
}

.carusel-product{
	padding-left: 15%;
	height: 80vh;
}

#productCarousel{
	height: 90vh;
}

.product-carusel-but{
	background-image: none !important;
}

.productimg img{
	height: auto !important;
	max-height: 90vh;
	min-width: auto !important;
	width: auto !important;
	margin:auto;
	padding-top: 40px;
	padding-bottom: 40px;
}

.lista-boxy-photos{
	padding-left: 0;
}

.lista-boxy-photos li{
	display: inline-block;
	height: 70px;
	width: 70px;
	background-color: #32312f;
	margin-right: 15px;
    margin-top: 15px;
    cursor: pointer;

}

.product-photo {
    max-height: 90vh;
    max-width: 100%;
    width: auto;
    height: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto
 }

 .frame {
    height: 90vh;
    width: 100%;
    position: relative;
 }

.lista-boxy-photos li:hover{
	border-color:white;
	outline: 2px solid;
}

@media screen and (min-device-width: 0px) and (max-device-width: 991px) {

	.carusel-product{
		padding-left: 0px;
	}

	.margin-podstrona{
		height: 100%;
	}

	.opis-schody{
		padding-left: 12%;
		padding-right: 12%;
	}
}

.activle{
	background-color: red;
}

@media screen and (min-device-width: 0px) and (max-device-width: 991px) {
	.img-schody-pro, .separator-schody-30-r, .separator-schody-30-l, .footer-menu{
		display: none;
	}

	.footer-logo{
		float: initial;
		display: block;
		margin: auto;
	}

	.head-schody-opis{
		padding-top: 20px;
	}
}

@media screen and (min-device-width: 0px) and (max-device-width: 428px) {
	.literka img{
		width: 200px;
	}

	.left-letter{
		height: 400px;
	}

	.title-page h1{
		font-size: 52px;
	}

	.right-text-box{
		height: auto;
	}

	.offer-bg{
		padding-bottom: 0;
	}

	.box1{
		top: 0;
	}
}

@media (max-width: 991px) {
  .navbar-header {
      float: none;
  }
  .navbar-left,.navbar-right {
      float: none !important;
  }
  .navbar-toggle {
      display: block;
  }
  .navbar-collapse {
      border-top: 1px solid transparent;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
  }
  .navbar-fixed-top {
      top: 0;
      border-width: 0 0 1px;
  }
  .navbar-collapse.collapse {
      display: none!important;
  }
  .navbar-nav {
      float: none!important;
      margin-top: 7.5px;
  }
  .navbar-nav>li {
      float: none;
  }
  .navbar-nav>li>a {
      padding-top: 10px;
      padding-bottom: 10px;
  }
  .collapse.in{
      display:block !important;
  }

  .menu-more{
  	display: none !important;
  }

  .phone-only{
	display: initial !important;
}

.opis-schody{
	height: 100%;
}

}
