.black{
	color: #000 !important;
}
.dark-grey{
	color: #2a2a2a !important;
}
.grey{
	color: #7a7a7a !important;
}
.light{
	font-weight: 300 !important;
}
.regular{
	font-weight: normal !important;
}
.bold{
	font-weight: bold !important;
}
img{
	max-width: 100% !important;
	height: auto !important;
}

@media screen and (max-width: 1279px) {
	/**** General CSS ****/
	.container{
		max-width: 1024px !important;
	}

	.hd-action strong{
		display: none !important;
	}
	.catalogs-sec.padding-sec{
		padding: 80px 0;
	}
	/**** Header CSS ****/
	.hd-action{
		margin-left: 40px;
	}
	#main-menu > ul > li{
		margin-left: 30px;
	}
	#header .btn-orange a, 
	#header .btn-orange a:visited, 
	#header li.btn-border a, 
	#header li.btn-border a:visited{
		padding: 9px 30px !important;
	}
	
	/**** Main Slider ****/
	.slider-item:before{
		width: 46%;
	}
	.main-slider.owl-carousel .owl-nav{
		left: calc(46% - 37px);
	}

	/**** Video Gallery Slider ****/
	.ourvideos-sec{
		text-align: center;
	}
	.ourvideos-sec .heading-block{
		text-align: center;
	}

	/**** Projects Filter ****/
	.projects-filter > div > div{
		padding: 30px 20px;
	}

	/**** Articles Slider ****/
	.cat-filter{
		padding: 180px 40px 94px 20px;
	}
	.articles-wrap .col-md-9 {
	    /*margin-left: 0;
	    -ms-flex: 0 0 75%;
	    flex: 0 0 75%;
	    max-width: 75%;*/
	}
	.articles-slider.owl-carousel .owl-nav{
		/*left: -80px;*/
	}
}
@media screen and (max-width: 991px) {
	/**** General CSS ****/
	.container{
		max-width: 100% !important;
	}
	.padding-sec,
	.catalogs-sec.padding-sec{
		padding: 60px 0;
	}
	.padding-top-sec{
		padding-top: 60px;
	}
	p:last-of-type{
		margin-bottom: 5px !important;
	}
	/**** Main Menu CSS ****/
	.hd-action a.btn-menu{
		display: inline-block !important;
	}
	#main-menu{
		opacity: 0;
		width: 100%;
	    position: fixed;
	    top: 100px;
	    /*right: 0;*/
	    bottom: 0;
	    left: -100%;
	    z-index: -1;
	    overflow: auto;
	    /*background-color: #6bba21;*/

	    -webkit-transition-property: left, background-color, opacity;
	    -webkit-transition-duration: 0.4s;
	    -webkit-transition-timing-function: linear;
	    -moz-transition-property: left, background-color, opacity;
	    -moz-transition-duration: 0.4s;
	    -moz-transition-timing-function: linear;
	    -ms-transition-property: left, background-color, opacity;
	    -ms-transition-duration: 0.4s;
	    -ms-transition-timing-function: linear;
	    -o-transition-property: left, background-color, opacity;
	    -o-transition-duration: 0.4s;
	    -o-transition-timing-function: linear;
	    transition-property: left, background-color, opacity;
	    transition-duration: 0.4s;
	    transition-timing-function: linear;
	}
	.hd-open{
	    overflow: hidden;
	}
	.bd-open #main-menu{
	    z-index: 5;
	}
	.hd-open #main-menu{
	    display: block;
	    /*width: 100%;*/
	    /*top: 100px;*/
	    left: 0;
	    opacity: 1;
	    z-index: 999;
	    background: #fff;
	}

	#main-menu > ul{
	    padding: 50px;
	    text-align: center;
	    display: flex;
	    flex-direction: column;
	    align-items: center;
	    justify-content: center;
	}
	#main-menu > ul > li{
		margin: 0 0 40px;
	}
	
	/**** Main Slider CSS ****/
	.main-slider .container{
		justify-content: center;
	}
	.slider-item:before{
		width: 100%;
	}
	.slider-item .slider-caption{
		max-width: 500px;
		text-align: center;
		padding-top: 70px;
	}
	.slider-caption2{
		left: 0;
		bottom: 0;
		padding: 10px 15px;
		text-align: center;
	}
	.main-slider.owl-carousel .owl-nav{
		/*display: none;*/
		position: static;
	}
	.main-slider.owl-carousel:hover .owl-nav{
		display: block;
	}
	.main-slider.owl-carousel .owl-nav button.owl-next, 
	.main-slider.owl-carousel .owl-nav button.owl-prev{
		position: absolute;
		top: 50%;
		margin: 0;
	}
	.main-slider.owl-carousel .owl-nav button.owl-next{
		right: 0;
	} 
	.main-slider.owl-carousel .owl-nav button.owl-prev{
		left: 0;
	}

	/**** Expertise CSS ****/
	.expertise-sec {
		text-align: center;
		background-attachment: scroll;
	}
	.expertise-sec .img-holder-wrap{
		width: 100%;
	}
	.expertise-sec .img-holder{
		background: rgb(255,255,255,0.60);
	}
	.expertise-sec .justify-content-end{
		justify-content: center !important;
	}

	/**** Projects CSS ****/
	.projects-sec .row{
		margin: 0 -15px;
		justify-content: center !important;
	}
	.projects-sec .col-md-5, .projects-sec .col-md-7{
		padding: 0 15px;
	}
	.projects-sec .project-info{
		padding: 17px 20px 20px;
	}
	
	/**** Terrace CSS ****/
	.terrace-item{
		height: 300px;
	}
	.terrace-info p{
		position: static;
	}

	/**** Catalogs CSS ****/
	.catalogs-sec{
		text-align: center;
	}
	.catalogs-sec:before{
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: rgba(0,0,0,0.49);
	}
	.catalogs-sec h3{
		font-size: 22px;
	}

	/**** Type de sol produits CSS ****/
	.product-item p{
		margin-bottom: 25px !important;
	}

	/**** Articles Slider ****/
	.cat-filter{
		padding: 180px 20px 94px;
	}
	.articles-wrap .col-md-9 {
	    margin-left: 0;
	    -ms-flex: 0 0 75%;
	    flex: 0 0 75%;
	    max-width: 75%;
	}
	.articles-slider.owl-carousel .owl-nav{
		left: -80px;
	}

	/**** Video Gallery ****/
	.yt-video-gallery{
		margin: 0 -15px;
	}
}
@media screen and (max-width: 767px) {
	/**** General CSS ****/
	h1{
		font-size: 46px;
	}
	h2{
		font-size: 34px;
	}
	.link{
		font-size: 20px;
	}
	.link i{
		font-size: 25px;
		margin-right: 10px !important;
	}
	.counter-sec h3 br,
	.expertise-sec .img-holder-wrap{
		display: none !important;
	}
	.img-holder-wrap, .img-holder{
		position: static;
		width: 100%;
		height: 300px;
	}
	.img-holder-wrap{
		margin-bottom: 55px;
	}
	.terraces-sec,
	.gradclip-sec{
		text-align: center;
		padding: 0 0 60px;
	}
	.terraces-sec .img-holder-wrap{
		border-bottom: 1px solid #eee;
	}
	/**** Header CSS ****/
	#header{
		height: 80px;
		padding: 12px 0;
	}
	#logo img{
		height: 56px !important;
	}
	/**** Main Slider CSS ****/
	.slider-item:before, #main-menu{
		top: 80px;
	}
	.main-slider .container{
		padding: 80px 15px 45px;
	}
	.slider-item .slider-caption{
		padding-top: 0;
	}
	.main-slider.owl-carousel .owl-nav{
		display: none;
	}
	.main-slider.owl-carousel:hover .owl-nav{
		display: block;
	}


	/**** Counter CSS ****/
	.counter-sec .col-md-4{
		margin-bottom: 30px;
	}
	.counter-sec .col-md-4:last-child{
		margin-bottom: 5px;
	}

	/**** Expertise CSS ****/
	.expertise-sec:before{
		content: "";
		position: absolute;
	    top: 0px;
	    right: 0px;
	    bottom: 0px;
	    left: 0px;
	    z-index: 0;
	    background: rgb(255,255,255,0.60);
	}

	/**** Projects CSS ****/
	.projects-sec .heading-block{
		text-align: center;
	}
	.projects-sec .row > div{
		margin-bottom: 30px;
	}
	.projects-sec .row > div:last-child{
		margin-bottom: 0px;
	}
	.projects-sec .project-item{
		display: block;
		width: 100%;
		
	}

	/**** Page Banner CSS ****/
	.page-banner{
		height: 380px;
		padding-top: 80px;
		background-position: center center;
		position: relative;
	}
	.page-banner:before{
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: rgba(255, 255, 255, 0.59);
	}
	.page-banner.txt-white:before{
		background: rgba(0, 0, 0, 0.49);
	}

	/**** Terrace CSS ****/
	.terracesgrid-sec .row > div{
		margin: 0 15px 30px;
	}
	.terracesgrid-sec .row > div:last-child{
		margin-bottom: 0;
	}
	.terrace-info{
		padding: 17px 15px 20px;	
		background: rgba(0,0,0,0.49);
	}

	/**** Footer Widgets CSS ****/
	.ft-widgets-wrap{
		text-align: center;
		padding: 50px 15px 45px;
	}
	#footer .ft-social{
		margin-bottom: 40px;
	}
	.ft-widget-2{
		flex-direction: column;
	}
	.ft-widget{
		width: 100%;
		margin-bottom: 40px;
	}
	.ft-widget:last-child{
		margin-bottom: 0;
	}
	.ft-widget .widget-title{
		display: inline-block;
		padding-bottom: 10px;
	}
	#footer p, #footer ul li{
		line-height: 2em;
	}

}
@media screen and (max-width: 479px) {
	/**** General CSS ****/
	h1{
		font-size: 36px;
	}
	h2{
		font-size: 30px;
	}
	/*p, h1, h2, h3, h4, h5, h6{
		margin-bottom: 20px;
	}*/
	#main,
	.padding-sec,
	.catalogs-sec.padding-sec{
		padding: 50px 0;
	}
	.padding-top-sec{
		padding-top: 50px;
	}
	.img-holder-wrap{
		margin-bottom: 45px;
	}
	.terraces-sec,
	.gradclip-sec{
		padding: 0 0 50px;
	}
	/**** Main Slider CSS ****/
	.slider-caption2 p{
		font-size: 12px;
	}

	/**** Terraces CSS ****/
	.terrace-item,
	.product-item p a img{
		height: 250px !important;
	}


	
}
@media screen and (max-width: 320px) {
	.container{
		width: 320px !important;
		max-width: 320px !important;
	}
}