/* CSS3 STYLE GENERIC */
.wrap { width: 100%; height: auto; margin: 0px; float: left; border: none; overflow: hidden; position: relative; text-align: center; box-shadow: none; cursor: default; }
.wrap .service-overlay, .wrap .content { width: 100%; height: auto; position: absolute; overflow: hidden; top: 0; left: 0; }
.wrap img { display: block; position: relative; }
/* CSS3 EFFECTS */

/* FOURTH EFFECTS */

.service-effect .service-overlay { position: absolute; /* Center the mask */ top: 57px; left: 126px; cursor: pointer; border-radius: 50%; border-width: 50px; display: inline-block; height: 110px; width: 110px; border: 55px solid rgba(0, 0, 0, 0.5); -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; opacity: 1; visibility: visible; -moz-transform: scale(4); -webkit-transform: scale(4); -o-transform: scale(4); -ms-transform: scale(4); transform: scale(4); -moz-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.service-effect:hover .service-overlay { opacity: 0; border: 0px solid rgba(0,0,0,0.55); visibility: hidden; }
.service-effect:hover h2 { display: none }
.service-effect:hover .plsh-con { display: block }
.hovicon { display: inline-block; cursor: pointer; width: 90px; height: 90px; border-radius: 50%; text-align: center; position: relative; text-decoration: none; z-index: 1; color: #fff; opacity: 0.7; }
.hovicon:after { pointer-events: none; position: absolute; width: 100%; height: 100%; border-radius: 50%; content: ''; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }
.hovicon:before { speak: none; font-size: 48px; line-height: 90px; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; display: block; -webkit-font-smoothing: antialiased; }
.hovicon.our_effect { background: rgba(255, 255, 255, 0.1); -webkit-transition: background 0.2s, color 0.2s; -moz-transition: background 0.2s, color 0.2s; transition: background 0.2s, color 0.2s; }
.hovicon.our_effect:after { top: -0px; left: -0px; padding: 0px; box-shadow: 0 0 0 3px #2cc541; /*border:1px double #2cc541;*/
-webkit-transition: -webkit-transform 0.2s, opacity 0.2s; -webkit-transform: scale(.8); -moz-transition: -moz-transform 0.2s, opacity 0.2s; -moz-transform: scale(.8); -ms-transform: scale(.8); transition: transform 0.2s, opacity 0.2s; transform: scale(.8); opacity: 0; }
/* Effect 1a */
.hovicon.our_effect:hover { border: none; color: #41ab6b; padding: 8px; opacity: 1 }
.hovicon.our_effect:hover:after { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); opacity: 1; }
.view-images img { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.view-images .view-hover { background-color: rgba(146,96,91,0.3); -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -o-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.view-images:hover .view-hover { -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -o-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); }
.view-images { width: 100%; height: 100%; float: left; overflow: hidden; position: relative; text-align: center; cursor: default; }
.view-images .view-hover { width: 100%; height: 100%; position: absolute; overflow: hidden; top: 0; left: 0; background: rgba(43, 65, 89, 0.9); padding-top: 30% }
.view-images img { display: block; position: relative; }
.view-hover a { font-size: 14px; color: #fff; text-align: center; padding: 7px 12px; text-transform: uppercase; border-radius: 5px }
.view-hover a em { font-size: 16px; color: 10px; line-height: 16px; border-right: 2px solid #fff; padding-right: 8px; margin-right: 5px }
.view-hover .FB { background: #3b5998; margin-right: 10px; }
.view-hover .TW { background: #00aced; }
.view-hover .FB:hover { background: #fff; color: #3b5998; }
.view-hover .TW:hover { background: #fff; color: #00aced; }
.view-hover .FB:hover em { border-right: 2px solid #3b5998; }
.view-hover .TW:hover em { border-right: 2px solid #00aced; }
 @media (max-width: 1023px) {
.view-images .view-hover { padding-top: 18%; }
}
@media (max-width: 767px) {
.service-effect .service-overlay { background: none !important; border: none }
}
