/* Portolio Hover */



/*custom additions*/

a {
	
	scroll-behavior: smooth;
	
}


/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  display: block;
  position: absolute;
	left: 25%;
  top: 25%;
  background-color: rgba(240, 141, 25, 0.8);
  margin: auto;
  padding: 20px;
  width: 50%;
}

/* The Close Button */
.closeisoForm {
  color: #fff;
  float: right !important;
  font-size: 28px;
  font-weight: bold;
}

.closeisoForm:hover,
.closeisoForm:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.closeGloss {
  color: #fff;
  float: right !important;
  font-size: 28px;
  font-weight: bold;
}

.closeGloss:hover,
.closeGloss:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.closeHydro {
  color: #fff;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeHydro:hover,
.closeHydro:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.closeClean {
  color: #fff;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeClean:hover,
.closeClean:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.closeFoul {
  color: #fff;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeFoul:hover,
.closeFoul:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.closeScratch {
  color: #fff;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeScratch:hover,
.closeScratch:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.closeEco {
  color: #fff;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeEco:hover,
.closeEco:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.closeChemical {
  color: #fff;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeChemical:hover,
.closeChemical:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.closeUV {
  color: #fff;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeUV:hover,
.closeUV:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.closeSlip {
  color: #fff;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeSlip:hover,
.closeSlip:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.closeImpact {
  color: #fff;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.closeImpact:hover,
.closeImpact:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}


.mainContainer {
	display: flex;
	width: 100% !important;
	height: 100%;
	margin: 0 auto;
}

.subContainer {
	float: left;
	width: auto;
}

.infoBlockMobile {
	display: none;
}

@media (max-width: 1000px){
	.mainContainer {
		display: block;
		width: 100%;
	}
	
	.infoBlockBrowser {
	display: none;
	}
	.infoBlockMobile {
	display: inherit;
	}
	
	.modal-content {
  display: block;
  position: relative;
	left: 0;
  top: 15%;
  background-color: rgba(240, 141, 25, 0.8);
  margin: auto;
  padding: 20px;
  width: 75%;
	}
	
	.modal-content p {
		font-size: 1.3em;
	}
	

}


.about-parallax { 

  /* The image used */

  background-image: url("../images/about-parallax.jpg");



  /* Set a specific height */

  height: 950px; 



  /* Create the parallax scrolling effect */

  background-attachment: fixed;

  background-position: center;

  background-repeat: no-repeat;

  background-size: auto;

}



.sizer {

	

	width: 100%;

	height: auto;

	

}



.submit-button{

	background: #333;

	padding: 10px 25px 10px 25px;

	margin-top: 10px;

	border: none;

	transition: all 0.2s ease;

	margin-bottom: 10px;

}



.read-more a{

	background: #F08D19;

	color: white !important;

	font-size: 0.5em;

	font-weight: 300;

	padding: 10px 25px 10px 25px;

	margin-top: 10px;

	border: none;

	transition: all 0.2s ease;

	margin-bottom: 10px;

}



.read-more-regenesys a{

	background: #BED431;

	color: black !important;

	font-size: 0.5em;

	font-weight: 300;

	padding: 10px 25px 10px 25px;

	margin-top: 10px;

	border: none;

	transition: all 0.2s ease;

	margin-bottom: 10px;

}



.read-more:hover a{

	

	background: #333;

}



.read-more-regenesys:hover a{

	

	background: #333;

}















/*custom additions*/



.da-thumbs li ,

.da-thumbs li  img {

	display: block;

	position: relative;

	width: 100%;



}

.da-thumbs li  {

	overflow: hidden;



}

.da-thumbs li  article {

	position: absolute;

	background-repeat:repeat;

	width: 100%;

	height: 100%;

}

.da-thumbs li  article.da-animate {

	-webkit-transition: all 0.2s ease;

	-moz-transition: all 0.2s ease-in-out;

	-o-transition: all 0.2s ease-in-out;

	-ms-transition: all 0.2s ease-in-out;

	transition: all 0.2s ease-in-out;

}

/* Initial state classes: */

.da-slideFromTop {

	left: 0px;

	top: -100%;

}

.da-slideFromBottom {

	left: 0px;

	top: 100%;

}

.da-slideFromLeft {

	top: 0px; 

	left: -100%;

}

.da-slideFromRight {

	top: 0px;

	left: 100%;

}

/* Final state classes: */

.da-slideTop {

	top: 0px;

}

.da-slideLeft {

	left: 0px;

}

.da-thumbs li  article a {

	color:#fff;

	padding:20px;

	display:block;

	height:100%;

}



.da-thumbs {

text-align:center;

}



.da-thumbs li  article h3{

color:#fff;



}



.da-thumbs li  article span{



color:#fff;

display:block;

}





.photo-icon i{

	font-size:36px;

	margin: 25% 0 0 0;

	display:block;

}

.video-icon i{

	font-size:36px;

	margin: 20% 0 0 0;

	display:block;

}

a.i{

	text-decoration:none;

}

span.zoom{

overflow:hidden;

display:block;

width:35px;

height:35px;

background-color:#DF6232;

border-radius:50px;

cursor:pointer;

background-repeat:no-repeat;

background-position:center;

margin-left:10px;

}



.portfolio_2col article h3{

padding-top:70px !important;

}



/* Image Grid */

.image_grid {

	float:left;

	overflow:hidden;

	width:100%;

	position:relative;



}



.image_grid li{

	float: left;

	line-height: 17px;

	color: #686f74;

	list-style:none;

	overflow:hidden;



	text-align:center;

}





/* Responsive image grid*/

/* Mobile landscape width 320 */

@media only screen and (max-width: 480px) {

	.image_grid{

width:100%;

}



.image_grid li img{

width:100%;

}

#portfolio-items-wrap .portfolio-item {

width: 100% !important;

}

}

@media only screen and (max-width: 767px) {



.image_grid{

width:100%;

}



.image_grid li img{

width:100%;

}







}





 @media only screen and (min-width: 480px) and (max-width: 767px) {







.image_grid li{

width:100% !important;

}



.portfolio_4col .da-thumbs li article h3{

padding-top:58px;

}



.portfolio_3col .da-thumbs li article h3{

padding-top:34px;

}



.portfolio_2col .da-thumbs li article h3{

padding-top:23px !important;

}



}