/* CSS Document */
@font-face {
    font-family: 'Roboto-Regular';
    src: url('../fonts/Roboto-Regular.ttf');
    font-weight: normal;
    font-style: normal;
	}

@font-face {
    font-family: 'Roboto-Bold';
    src: url('../fonts/Roboto-Bold.ttf');
    font-weight: normal;
    font-style: normal;
	}

@font-face {
    font-family: 'Roboto-Light';
    src: url('../fonts/Roboto-Light.ttf');
    font-weight: normal;
    font-style: normal;
	}

@font-face {
    font-family: 'RobotoSlab-Bold';
    src: url('../fonts/RobotoSlab-Bold.ttf');
    font-weight: normal;
    font-style: normal;
	}


@font-face {
    font-family: 'RobotoSlab-Light';
    src: url('../fonts/RobotoSlab-Light.ttf');
    font-weight: normal;
    font-style: normal;
	}

@font-face {
    font-family: 'RobotoSlab-Regular';
    src: url('../fonts/RobotoSlab-Regular.ttf');
    font-weight: normal;
    font-style: normal;
	}
	body{
	font-family: 'Roboto-Regular';
	}
.navbar-default {
    background-color: #d62922;
    border-color: #d62922;
	box-shadow: 0 4px 8px 0 rgb(0, 0, 0), 0 6px 20px 0 rgb(214, 41, 34);
	padding: 0 0 30px;
}
.navbar-toggle {
 
    margin-top: 38px;
}
.nav > li {
    
   // margin-top: 30px;
}

.navbar-default .navbar-nav > li > a {
    color: #fff;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    color: #fff;
background-color: #dccd4e;
    border-radius: 23px;
    padding: 8px 32px;
	margin-top: 8px;
}

.about{
padding:30px 0 50px;
position:relative;
}
.about h2{
position:relative;
margin-bottom:40px;
font-family: 'RobotoSlab-Bold';
}

.about h2:before{
content:"";
position:absolute;
background:#dccd4e;
width:150px;
height:1px;
left:0;
bottom:-10px;

}
.about h2:after{
content:"";
position:absolute;
background:#dccd4e;
width:50px;
height:5px;
left:0;
bottom:-10px;
transition:all 3s ease-out;
}
.about:hover h2:after{
transition:all 3s ease-out;
width:150px;

}
.about-content{
border:3px solid #dccd4e;
padding:15px;
text-align:justify;
}
.products{
background:url(../img/products.jpg) no-repeat center;
background-attachment:fixed;
background-size:cover;
padding:30px 0 50px;
color:#fff;
}
.products h2{
position:relative;
margin-bottom:40px;
font-family: 'RobotoSlab-Bold';
}

.products h2:before{
content:"";
position:absolute;
background:#dccd4e;
width:150px;
height:1px;
left:0;
bottom:-10px;

}
.products h2:after{
content:"";
position:absolute;
background:#dccd4e;
width:50px;
height:5px;
left:0;
bottom:-10px;
transition:all 3s ease-out;
}
.products:hover h2:after{
transition:all 3s ease-out;
width:150px;

}
.products ul li, .products h4, .products h2{
text-align:left;
}
.products{
text-align:center;
}
.contact{
padding:30px 0 50px;
}
.contact h2{
position:relative;
margin-bottom:40px;
font-family: 'RobotoSlab-Bold';
}

.contact h2:before{
content:"";
position:absolute;
background:#dccd4e;
width:150px;
height:1px;
left:0;
bottom:-10px;

}
.contact h2:after{
content:"";
position:absolute;
background:#dccd4e;
width:50px;
height:5px;
left:0;
bottom:-10px;
transition:all 3s ease-out;
}
.contact:hover h2:after{
transition:all 3s ease-out;
width:150px;

}
.contact input{
margin-bottom:20px;
}
.footer{
background:#d62922;
color:#fff;
text-align:center;
padding-top:10px;
}

/***********products part starts from here**************************/
.slider{
background:url(../img/products.jpg) no-repeat center;
height:300px;
background-size:cover;
position:relative;

}
.slider p{
font-size:24px;
color:#dccd4e;
position:absolute;
bottom:10px;
left:20px;
font-family: 'RobotoSlab-Bold';
}
.product-tab{
padding:50px 0;
}
.product-tab .nav-pills > li {
    float: left;
    width: 100%;
	border-bottom:4px solid #dccd4e;
	

}
.nav-pills > li > a {
    border-radius: 0px;
}

.producr-clr{
background:#dedede;

}
.contact .form-control {
border:3px solid #dccd4e;
}
.contact{
background:#f3f3f3;
}
.contact button{
width:100%;
}

/***********about part starts from here**************************/
.about-img{
position:relative;
}
.about-img:before{
content:"";
position:absolute;
width:100%;
height:100%;
left:-20px;
background:#000;
z-index:-1;
top:-20px;
}
.contact-uss{
padding:30px 0 50px;
}
.contact-uss input{
margin-bottom:20px;
}
.contact-uss h2{
position:relative;
margin-bottom:40px;
font-family: 'RobotoSlab-Bold';
}

.about-us{
padding:50px 0;
}

.about-us  h2{
position:relative;
margin-bottom:70px;
font-family: 'RobotoSlab-Bold';
}

.about-us  h2:before{
content:"";
position:absolute;
background:#dccd4e;
width:150px;
height:1px;
left:0;
bottom:-10px;

}
.about-us  h2:after{
content:"";
position:absolute;
background:#dccd4e;
width:50px;
height:5px;
left:0;
bottom:-10px;
transition:all 3s ease-out;
}
.about-us :hover h2:after{
transition:all 3s ease-out;
width:150px;

}
.contact-uss h2:before{
content:"";
position:absolute;
background:#dccd4e;
width:150px;
height:1px;
left:0;
bottom:-10px;

}
.contact-uss h2:after{
content:"";
position:absolute;
background:#dccd4e;
width:50px;
height:5px;
left:0;
bottom:-10px;
transition:all 3s ease-out;
}
.contact-uss:hover h2:after{
transition:all 3s ease-out;
width:150px;

}


.project h2{
position:relative;
margin-bottom:40px;
font-family: 'RobotoSlab-Bold';
}

.project h2:before{
content:"";
position:absolute;
background:#dccd4e;
width:150px;
height:1px;
left:0;
bottom:-10px;

}
.project h2:after{
content:"";
position:absolute;
background:#dccd4e;
width:50px;
height:5px;
left:0;
bottom:-10px;
transition:all 3s ease-out;
}
.project:hover h2:after{
transition:all 3s ease-out;
width:150px;

}
.glass{
	/* background styles */
	position: relative;
	display: inline-block;
	padding: 10px 25px;
	background-color: #dccd4e; /*for compatibility with older browsers*/
	background-image: linear-gradient(red,lightred);

	/* text styles */
	text-decoration: none;
	color: #fff;
	font-size: 15px;
	font-family: sans-serif;
	font-weight: 100;
}
.glass:after{
	content: '';
	position: absolute;
	top: 2px;
	left: 2px;
	width: calc(100% - 4px);
	height: 50%;
	background: linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.2));
}
.project{
padding:50px 0;}
.fa {
color: #dccd4e;
font-size:20px;
}
.rail{
padding:20px 0;
}