@charset "utf-8";
/* CSS Document */



/*-------------------------------*/
    /* Mobile Apps & Features */
/*-------------------------------*/

/*single feature*/
.single-feature, .bg-apps {
   position: relative;
}
/*apps background*/
.bg-apps {
   background: url(../images/bg-apps.jpg) no-repeat;
   background-attachment: fixed;
   background-position: center center;
   -webkit-background-size: cover;
   background-size: cover;
}
.bg-apps .image {}

/*app features*/
.feature-item .icon {
   -webkit-transition: all .5s ease-in;
   -o-transition: all .5s ease-in;
   transition: all .5s ease-in;
}
.opacities {
   opacity: .5;
}
#app-feature .feature-item {
	padding: 15px 0;
}

#dh-feature .feature-item {
	padding: 15px 0;
}

#case-feature .feature-item {
	padding: 15px 0;
}
 
#glider-feature .feature-item {
	padding: 15px 0;
}

#awn-feature .feature-item {
	padding: 15px 0;
}
 
#proj-feature .feature-item {
	padding: 15px 0;
}

#patio-feature .feature-item {
	padding: 15px 0;
}


#app-feature .feature-item:hover {
   cursor: pointer;
}

#dh-feature .feature-item:hover {
   cursor: pointer;
}

#case-feature .feature-item:hover {
   cursor: pointer;
}

#glider-feature .feature-item:hover {
   cursor: pointer;
}

#awn-feature .feature-item:hover {
   cursor: pointer;
}

#proj-feature .feature-item:hover {
   cursor: pointer;
}

#patio-feature .feature-item:hover {
   cursor: pointer;
}

.feature-item img,
.feature-item .icon{
   display: inline-block;
}
.feature-item img {
	max-width: 290px;
}
.feature-item h4 {
	font-weight: 600;
	color: #222222;
	font-size: 1.125rem;
	margin-bottom: 10px;
}
.feature-item .icon {
	background: #00567d;
	width: 90px;
	height: 90px;
	text-align: center;
	position: relative;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	z-index: 1;
	font-size: 34px;
	line-height: 90px;
	color: #fff;
}
.feature-item .icon::before {
	content: "";
	background: transparent;
	top: 1px;
	left: 1px;
	bottom: 1px;
	right: 1px;
	position: absolute;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	border: 4px solid #fff;
}
.feature-item:hover .icon {
    -webkit-animation: itg_pulse 1s infinite;
    -o-animation: itg_pulse 1s infinite;
    animation: itg_pulse 1s infinite;
    -webkit-box-shadow:0 0 0 0 rgba(237, 26, 28, 1);
    box-shadow:0 0 0 0 rgba(237, 26, 28, 1);
}

@-webkit-keyframes itg_pulse {
    0% {
        -webkit-box-shadow: 0 0 0 5px rgba(237, 26, 28, 0.9);
        box-shadow: 0 0 0 5px rgba(237, 26, 28, 0.9);
    }
    25% {
        -webkit-box-shadow: 0 0 0 10px rgba(237, 26, 28, 0.6);
        box-shadow: 0 0 0 10px rgba(237, 26, 28, 0.6);
    }
    70% {
        -webkit-box-shadow: 0 0 0 15px rgba(237, 26, 28, 0.3);
        box-shadow: 0 0 0 15px rgba(237, 26, 28, 0.3);
    }
    100% {
        -webkit-box-shadow: 0 0 0 60px rgba(237, 26, 28, 0.1);
        box-shadow: 0 0 0 20px rgba(237, 26, 28, 0.1);
    }
}
@-o-keyframes itg_pulse {
    0% {
        box-shadow: 0 0 0 5px rgba(237, 26, 28, 0.9);
    }
    25% {
        box-shadow: 0 0 0 10px rgba(237, 26, 28, 0.6);
    }
    70% {
        box-shadow: 0 0 0 15px rgba(237, 26, 28, 0.3);
    }
    100% {
        box-shadow: 0 0 0 20px rgba(237, 26, 28, 0.1);
   }
}
@keyframes itg_pulse {
    0% {
        -webkit-box-shadow: 0 0 0 5px rgba(237, 26, 28, 0.9);
        box-shadow: 0 0 0 5px rgba(237, 26, 28, 0.9);
    }
    25% {
        -webkit-box-shadow: 0 0 0 10px rgba(237, 26, 28, 0.6);
        box-shadow: 0 0 0 10px rgba(237, 26, 28, 0.6);
    }
    70% {
        -webkit-box-shadow: 0 0 0 15px rgba(237, 26, 28, 0.3);
        box-shadow: 0 0 0 15px rgba(237, 26, 28, 0.3);
    }
    100% {
        -webkit-box-shadow: 0 0 0 60px rgba(237, 26, 28, 0.1);
        box-shadow: 0 0 0 20px rgba(237, 26, 28, 0.1);
   }
}

#app-feature .feature-item:hover .icon {
	background: #8bc43e;
} 

#dh-feature .feature-item:hover .icon {
	background: #8bc43e;
} 

#case-feature .feature-item:hover .icon {
	background: #8bc43e;
} 
 
#glider-feature .feature-item:hover .icon {
	background: #8bc43e;
} 
 
#awn-feature .feature-item:hover .icon {
	background: #8bc43e;
} 

#proj-feature .feature-item:hover .icon {
	background: #8bc43e;
} 
 
#patio-feature .feature-item:hover .icon {
	background: #8bc43e;
} 

#app-feature .content-left {
   text-align: right;
}

#dh-feature .content-left {
   text-align: right;
}

#case-feature .content-left {
   text-align: right;
}

#glider-feature .content-left {
   text-align: right;
}

#awn-feature .content-left {
   text-align: right;
}

#proj-feature .content-left {
   text-align: right;
}

#patio-feature .content-left {
   text-align: right;
}

#app-feature .content-right {
   text-align: left;
}

#dh-feature .content-right {
   text-align: left;
}

#case-feature .content-right {
   text-align: left;
}

#glider-feature .content-right {
   text-align: left;
}

#awn-feature .content-right {
   text-align: left;
}

#proj-feature .content-right {
   text-align: left;
}

#patio-feature .content-right {
   text-align: left;
}

#app-feature .content-left span {
	float: right;
	margin-left: 15px;
}

#dh-feature .content-left span {
	float: right;
	margin-left: 15px;
}

#case-feature .content-left span {
	float: right;
	margin-left: 15px;
}

#glider-feature .content-left span {
	float: right;
	margin-left: 15px;
}

#awn-feature .content-left span {
	float: right;
	margin-left: 15px;
}

#proj-feature .content-left span {
	float: right;
	margin-left: 15px;
}

#patio-feature .content-left span {
	float: right;
	margin-left: 15px;
}
#app-feature .content-right span {
	float: left;
	margin-right: 15px;
}

#dh-feature .content-right span {
	float: left;
	margin-right: 15px;
}

#case-feature .content-right span {
	float: left;
	margin-right: 15px;
}

#glider-feature .content-right span {
	float: left;
	margin-right: 15px;
}

#awn-feature .content-right span {
	float: left;
	margin-right: 15px;
}

#proj-feature .content-right span {
	float: left;
	margin-right: 15px;
}

#patio-feature .content-right span {
	float: left;
	margin-right: 15px;
}
#app-feature .content-left .text {
   margin-right: 105px;
}

#dh-feature .content-left .text {
   margin-right: 105px;
}

#case-feature .content-left .text {
   margin-right: 105px;
}

#glider-feature .content-left .text {
   margin-right: 105px;
}

#awn-feature .content-left .text {
   margin-right: 105px;
}

#proj-feature .content-left .text {
   margin-right: 105px;
}

#patio-feature .content-left .text {
   margin-right: 105px;
}
#app-feature .content-right .text {
   margin-left: 105px;
}

#dh-feature .content-right .text {
   margin-left: 105px;
}

#case-feature .content-right .text {
   margin-left: 105px;
}

#glider-feature .content-right .text {
   margin-left: 105px;
}

#awn-feature .content-right .text {
   margin-left: 105px;
}

#proj-feature .content-right .text {
   margin-left: 105px;
}

#patio-feature .content-right .text {
   margin-left: 105px;
}

.feature-item.active {
   background: #f7f7f7;
}
.image.mobile-apps > img {
   opacity: 0;
}
.image.mobile-apps.active > img {
   opacity: 1;
}


@media screen and (max-width: 992px) {
	#app-feature,
   #app-feature .content-left,
   #app-feature .content-right {
      text-align: center;
   }
	
	#dh-feature,
	#dh-feature .content-left,
	#dh-feature .content-right {
      text-align: center;
   }

#case-feature,
#case-feature .content-left,
#case-feature .content-right {
      text-align: center;
   }

#glider-feature,
#glider-feature .content-left,
#glider-feature .content-right {
      text-align: center;
   }
	   
#awn-feature,
#awn-feature .content-left,
#awn-feature .content-right {
      text-align: center;
   }
	
#proj-feature,
#proj-feature .content-left,
#proj-feature .content-right {
      text-align: center;
   }

#patio-feature,
#patio-feature .content-left,
#patio-feature .content-right {
      text-align: center;
   }
	
   #app-feature .feature-item {
      padding: 0;
      max-width: 300px;
      display: inline-block;
      float: none;
   }
	
	#dh-feature .feature-item {
      padding: 0;
      max-width: 300px;
      display: inline-block;
      float: none;
   }

#case-feature .feature-item {
      padding: 0;
      max-width: 300px;
      display: inline-block;
      float: none;
   }

#glider-feature .feature-item {
      padding: 0;
      max-width: 300px;
      display: inline-block;
      float: none;
   }

#awn-feature .feature-item {
      padding: 0;
      max-width: 300px;
      display: inline-block;
      float: none;
   }

#proj-feature .feature-item {
      padding: 0;
      max-width: 300px;
      display: inline-block;
      float: none;
   }

#patio-feature .feature-item {
      padding: 0;
      max-width: 300px;
      display: inline-block;
      float: none;
   }
	
   #app-feature .content-left span,
   #app-feature .content-right span {
      float: none;
      margin: 0 auto 15px auto;
      display: inline-block;
   }


#dh-feature .content-left span,
#dh-feature .content-right span {
      float: none;
      margin: 0 auto 15px auto;
      display: inline-block;
   }

#case-feature .content-left span,
#case-feature .content-right span {
      float: none;
      margin: 0 auto 15px auto;
      display: inline-block;
   }

#glider-feature .content-left span,
#glider-feature .content-right span {
      float: none;
      margin: 0 auto 15px auto;
      display: inline-block;
   }

#awn-feature .content-left span,
#awn-feature .content-right span {
      float: none;
      margin: 0 auto 15px auto;
      display: inline-block;
   }

#proj-feature .content-left span,
#proj-feature .content-right span {
      float: none;
      margin: 0 auto 15px auto;
      display: inline-block;
   }

#patio-feature .content-left span,
#patio-feature .content-right span {
      float: none;
      margin: 0 auto 15px auto;
      display: inline-block;
   }
	
   #app-feature .content-left .text,
   #app-feature .content-right .text {
      margin: 0;
   }
	
	#dh-feature .content-left .text,
#dh-feature .content-right .text {
      margin: 0;
   }

#case-feature .content-left .text,
#case-feature .content-right .text {
      margin: 0;
   }

#glider-feature .content-left .text,
#glider-feature .content-right .text {
      margin: 0;
   }

#awn-feature .content-left .text,
#awn-feature .content-right .text {
      margin: 0;
   }

#proj-feature .content-left .text,
#proj-feature .content-right .text {
      margin: 0;
   }

#patio-feature .content-left .text,
#patio-feature .content-right .text {
      margin: 0;
   }
}



/*-------------------------------*/
    /*Mobile Apps ends */
/*-------------------------------*/