html {
scroll-behavior: smooth
}
HTML BODY {
max-width: 1900px;
margin: 0 auto
}
:root {
--bg-color1: #2d2d2d;
--bg-color2: #4b9cd6;
--bg-color3: #929499;
--bg-color4: #f9f9f9;
--title-black: 'montserratbold';
--title-bold: 'montserratbold';
--font-regular: 'RobotoRegular';
--font-bold: 'RobotoRegular';
--font-italic: 'RobotoRegular';
--font-menu: 'RobotoRegular';
--font-alt: 'montserratregular'
}
HTML BODY .h1,
HTML BODY .h2,
HTML BODY h1 {
font-family: var(--title-black) !important;
}
HTML BODY h2,
HTML BODY h3,
HTML BODY h4,
HTML BODY h5,
HTML BODY h6 {
font-family: var(--title-bold);    
}
HTML BODY,
HTML BODY p {
font-family: var(--font-regular);    
}
HTML BODY strong {
font-family: var(--font-bold)
}
HTML BODY em {
font-family: var(--font-italic)
}
.alt-font {
font-family: var(--font-alt) !important
}
.footerFont {
font-family:var(--font-regular)!important
}
.footerSize {
font-size: 14px!important;
color: #ccc!important;
}
.top-header,
.top-header a,
.top-header p {
font-size: 14px !important
}
.middle-header,
.middle-header p {
font-size: 90% !important
}
.bottom-header,
.bottom-header a,
.bottom-header li a,
.bottom-header p {
font-size: 100% !important
}
a {
text-decoration: none !important
}
.badge,.btn {
white-space: pre-line !important;
}
.bg-color1,
.bg-color1:hover {
background: var(--bg-color1) !important
}
.t-color1,.t-color1:hover {
color: var(--bg-color1) !important;
}
.bg-color2,
.bg-color2:hover {
background: var(--bg-color2) !important
}
.t-color2,
.t-color2:hover {
color: var(--bg-color2) !important
}
.bg-color3,.bg-color3:hover{
background: var(--bg-color3) !important
}
.t-color3,
.t-color3:hover {
color: var(--bg-color3) !important
}
.footer a.t-color3{color: #4c4c4c!important;}
.footer a.t-color3:hover{color: var(--bg-color3)!important;}
.bg-color3-hover:hover,
.bg-color4,
.bg-color4:hover {
background: var(--bg-color4)!important
}
.t-color4,
.t-color4:hover {
color: var(--bg-color4) !important
}
.bg-dark-25 {
background: rgba(0, 0, 0, 0.25)
}
.bg-dark-50 {
background: rgba(0, 0, 0, 0.40)
}
.bg-dark-75 {
background: rgba(140, 196, 64, 0.93)
}
.bg-dark-gradient-50 {
background: linear-gradient(0deg, #e2ffd0 50%,#fff 50%) !important;
}
.bg-img-thank-you-page {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/elements/slider/1.jpg)
}
.bg-img1 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/elements/bg/bg_1.jpg)
}
.bg-img2 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/elements/bg/bg_2.png)
}
.bg-img3 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/elements/bg/bg_3.jpg)
}
.bg-img4 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/elements/bg/bg_4.jpg)
}
.bg-img5 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/elements/bg/bg_5.jpg)
}
.bg-img6 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/elements/bg/bg_6.jpg)
}
.bg-img7 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/elements/bg/bg_7.jpg)
}
.bg-imgMobile {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/elements/slider/bg_imgMobile.jpg)
}
.bg-img {
background-size: cover
}
.bg-img-100 {
background-size: 100%
}
.bg-img-contain {
background-size: contain
}
.bg-repeat-x {
background-repeat: repeat-x
}
.bg-repeat-y {
background-repeat: repeat-y
}
.bg-no-repeat {
background-repeat: no-repeat
}
.bg-img-fixed {
background-attachment: fixed
}
.bg-img-top-left {
background-position: top left
}
.bg-img-top-center {
background-position: top center
}
.bg-img-top-right {
background-position: top right
}
.bg-img-center-left {
background-position: center left
}
.bg-img-center-center {
background-position: center center
}
.bg-img-center-right {
background-position: center right
}
.bg-img-right-left {
background-position: right left
}
.bg-img-right-center {
background-position: right center
}
.bg-img-right-right {
background-position: right right
}
.t-shadow-50 {
text-shadow: 0 0 10px rgba(0, 0, 0, .2)
}
.t-shadow-100 {
text-shadow: 0 0 10px #000
}
i {
position: relative;
vertical-align: -5px
}
.fa {
transform: translateY(-5px)
}
.list-style-none2 li {
list-style: none;transition: all .5s ease-in-out; padding-bottom: 6px; border-bottom: 0.5px solid #dbdbdb;
margin-left: 0!important;
padding-left: 0!important;
left: 0!important;
}
.list-style-none li {
list-style: none;
}
.footer .list-style-none li, .footer span.services{
border-bottom: 1px dashed #545555;
padding-bottom: 11px;
transition: all .5s ease-in-out}
.footer .list-style-none li a,.footer .list-style-none2 li a{
color: #ffffff;
}
.footer .list-style-none li:hover a,.footer .list-style-none2 li:hover a{
color: var(--bg-color2)!important;}
.footer .list-style-none li:hover,.footer .list-style-none2 li:hover {
padding-left: 5px; transition: all .5s ease-in-out
}
@media screen and (max-width:500px) {
.h1Title h1.h3{ padding-top: 23%!important; font-size: 17px!important;}
}
.h1Title h1.h3{ padding-top: 0%;padding-top: 0; }
.main-navbar .dropdown,
.main-navbar .dropdown:hover,
.main-navbar .navbar-nav a,
.main-navbar .navbar-nav a:hover,
a[data-fancybox=gallery]>img:hover {
transition: all .3s ease;
}
.main-navbar .navbar-nav a {
color: var(--bg-color2);
font-size: 16px!important
}
.main-navbar .navbar-nav a:hover {
color: var(--bg-color3)
}
.dropdown-menu a:hover,
.main-navbar .navbar-nav .active a {
border-bottom: 2px solid var(--bg-color4)!important;
color:var(--bg-color4)!important;
font-weight: 900;
}
.navbar-toggler {
background: var(--bg-color3) !important
}
.main-navbar .dropdown .active,
.main-navbar .dropdown:hover {
background: var(--bg-color3) !important;
}
.main-navbar .dropdown .active, .main-navbar .dropdown:hover a.text-dark{ color: #fff!important;}
.main-navbar .dropdown-menu {
padding: 0
}
.main-navbar .dropdown-menu a {
color: #fff;
background: 0 0
}
.main-navbar .dropdown-menu a:hover {
background: var(--bg-color1)!important;
background: 0 0;
}
.main-navbar .dropdown-menu {
background: var(--bg-color3);
border-radius: 0 !important;
transform: translateY(-2px);
border: none
}
.carousel-fade .carousel-item {
opacity: 0;
transition-duration: .6s;
transition-property: opacity;
}
.carousel-fade  .carousel-item.active,
.carousel-fade  .carousel-item-next.carousel-item-left,
.carousel-fade  .carousel-item-prev.carousel-item-right {
opacity: 1;
}
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-right {
opacity: 0;
}
.carousel-fade  .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-prev {
transform: translateX(0);
transform: translate3d(0, 0, 0);
}
.delay1s{
animation-duration: 9s;
transition-delay: 9s;
}
.delaySliderText {
animation-duration: 1.5s;
animation-name: appearCaption;  
}
#CarouselHome .carousel-caption h5 {
font-size: 180%
}
#CarouselHome .carousel-caption p {
font-size: 120%!important
}
#CarouselHome .carousel-caption a.btn {
font-size: 90%
}
.carousel-caption{ padding: 3%;}
.carousel-caption:after {
content: '';
height: 4em;
width: 4em;
border-bottom: 0.8em solid var(--bg-color4);
border-left: 0.8em solid var(--bg-color4);
position: absolute;
bottom: -1em;
left: -1em;
}
@media(min-width:250px) {
.image-min {
width: 100% !important
}
.negative-margin-top2,
.services-home {
margin-top: -8% !important
}
#CarouselHome .carousel-caption h3 {
font-size: 25px !important;
}
#CarouselHome .carousel-caption h4 {
font-size: 11px !important;
}
.carousel-caption {
bottom: 24%!important;
}
#CarouselHome .carousel-caption a.btn {
font-size: 11px;
}
.bg-dark-gradient-50 {
background: linear-gradient(0deg, #e2ffd0 50%,#fff 50%) !important
}
.top-slider {
margin-top: -210px;
position: relative;
z-index: 0;
}
.top-slider1 {
margin-top: -298px;
position: relative;
z-index: 0; }
.efectMissionIcon {
margin-left: 0 !important
}
}
@media(min-width:540px) {
.carousel-caption {
bottom: 9%!important
}
.negative-margin-top2 {
margin-top: 5%
}
.top-slider{
margin-top: -498px;
position: relative;
z-index: 0
}
.top-slider1 {
margin-top: -298px;
position: relative;
z-index: 0; }
#CarouselHome .carousel-caption h3 {
font-size: 37px !important;
}
#CarouselHome .carousel-caption a.btn {
font-size: 18px;
}
}
@media(min-width:768px) {
.efectMissionIcon {
margin-left: -41px !important
}
#CarouselHome .carousel-caption h3 {
font-size: 25px !important;
}
#CarouselHome .carousel-caption h4 {
font-size: 15px !important;
}
#CarouselHome .carousel-caption a.btn {
font-size: 20px!important
}
.position-img{bottom: -291px;}
.top-slider{
margin-top: -195px;
position: relative;
z-index: 0
}
.top-slider1 { margin-top: -274px; position: relative; z-index: 0}   
}
@media(min-width:960px) {
.image-min {
width: 70% !important
}
.carousel-caption {
bottom: 14% !important
}
.negative-margin-top2 {
margin-top: -2%
}
#CarouselHome .carousel-caption h3 {
font-size: 230% !important
}
#CarouselHome .carousel-caption h4 {
font-size: 19px!important;
}
.top-slider,.top-slider1 {
margin-top: -268px;
position: relative;
z-index: 0
}
}
@media(min-width:992px) {
.position-img{bottom: -369px;}
}
@media(min-width:1140px) {
.image-min {
width: 70% !important
}
.carousel-caption {
bottom: 18%!important
}
.negative-margin-top2 {
margin-top: -2%
}
#CarouselHome .carousel-caption h3 {
font-size: 250% !important
}
.top-slider,.top-slider1 {
margin-top: -276px;
position: relative;
z-index: 0
}
}
@media(min-width:1200px) {
.position-img{ bottom: -416px;}
.image-min {
width: 70% !important
}
.carousel-caption {
bottom: 18%!important
}
.negative-margin-top2 {
margin-top: -2%
}
#CarouselHome .carousel-caption h3 {
font-size: 250% !important
}
.top-slider,.top-slider1 {
margin-top: -276px;
position: relative;
z-index: 0
}
}
@media screen and (max-height:991px) {
.float-menu { position: relative; left: 0px!important; right: 0px!important;}
}
.top-menu {
position: relative;
z-index: 3;
}
.float-menu {
position: absolute;
z-index: 100;
left: 15px;
right: 15px;
}
a.navbar-brand {
font-size: 130% !important
}
.navbar-toggler {
margin-bottom: 10px
}
.go-up {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/src/images/elements/top.png) var(--bg-color2) center center;
border-radius: 50px;
opacity: .5;
cursor: pointer;
width: 40px;
height: 40px;
position: fixed;
bottom: 67px;
right: 25px;
display: inline-block !important
}
.go-up:hover {
opacity: 1
}
.hide-top,
.hide-top-alt {
opacity: 0 !important
}
.icon-align {
min-width: 24px;
text-align: center;
position: absolute;
left: 20px;
margin-top: 8px
}
.icon-align-ul li {
list-style: none
}
.shake-bottom:hover img.servicesIcon {
-webkit-animation: shake-bottom .8s cubic-bezier(.455, .030, .515, .955) 3 both;
animation: shake-bottom .8s cubic-bezier(.455, .030, .515, .955) 3 both
}
.shake-bottom {
-webkit-animation: shake-bottom .8s cubic-bezier(.455, .030, .515, .955) 3 both;
animation: shake-bottom .8s cubic-bezier(.455, .030, .515, .955) 3 both
}
@-webkit-keyframes shake-bottom {
0%,
100% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%
}
10% {
-webkit-transform: rotate(2deg);
transform: rotate(2deg)
}
20%,
40%,
60% {
-webkit-transform: rotate(-4deg);
transform: rotate(-4deg)
}
30%,
50%,
70% {
-webkit-transform: rotate(4deg);
transform: rotate(4deg)
}
80% {
-webkit-transform: rotate(-2deg);
transform: rotate(-2deg)
}
90% {
-webkit-transform: rotate(2deg);
transform: rotate(2deg)
}
}
@keyframes shake-bottom {
0%,
100% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: 50% 100%;
transform-origin: 50% 100%
}
10% {
-webkit-transform: rotate(2deg);
transform: rotate(2deg)
}
20%,
40%,
60% {
-webkit-transform: rotate(-4deg);
transform: rotate(-4deg)
}
30%,
50%,
70% {
-webkit-transform: rotate(4deg);
transform: rotate(4deg)
}
80% {
-webkit-transform: rotate(-2deg);
transform: rotate(-2deg)
}
90% {
-webkit-transform: rotate(2deg);
transform: rotate(2deg)
}
}
.listNumber {
border: 2px solid #fff !important;
padding: 10px;
border-radius: 50%;
margin-right: 5px
}
p:hover .listNumber {
background: var(--bg-color3) !important;
color: #fff !important
}
.form-control {
border-radius: 0 !important;
border: 1px solid #ccc !important;
transition: all .5s ease-in-out !important
}
.form-control:hover {
transition: all .5s ease-in-out !important
}
.input-group-text {
border: none !important;
border-bottom: 1px solid #ccc !important;
border-radius: 0 !important
}
.efect-box,
.efectIN {
transition: all .5s ease-in-out !important
}
.efect-box:hover {
transform: translate(10px, 10px);
transition: all .5s ease-in-out
}
.efectIN:hover .missionImg {
transition: all .5s ease-in-out !important;
transform: scale(.9);
-webkit-transform: scale(.9);
-ms-transform: scale(.9);
-moz-transform: scale(.9)
}
.efectUP .missionImg{
transition: transform .3s cubic-bezier(.34, 2, .6, 1), box-shadow .2s ease;
}
.efectUP:hover .missionImg {
box-shadow: 0 12px 19px -7px rgb(0 0 0 / 30%);
transform: translateY(-10px);
-webkit-transform: translateY(-10px);
-ms-transform: translateY(-10px);
-moz-transform: translateY(-10px);
transition: all .5s ease-in-out
}
.efectUPReadMore{
transition: all .5s ease-in-out
}
.efectUPReadMore:hover {
transform: translateY(-8px);
-webkit-transform: translateY(-8px);
-ms-transform: translateY(-8px);
-moz-transform: translateY(-8px);
transition: all .5s ease-in-out
}
.bottom-shadow {    
-webkit-box-shadow: 0px 0px 20px 1px #e4e4e4;
box-shadow: 0px 0px 20px 1px #e4e4e4;
}
.position-img {
margin-right: -11em;
margin-top: 2em;
}
.bottom-shadow-hover{  transition: all .5s ease-in-out !important;}
.bottom-shadow-hover:hover {
-webkit-box-shadow: 0 10px 17px -6px #001135;
box-shadow: 0 10px 17px -6px #001135;
transition: all .5s ease-in-out !important;
}
.flip-card {
background-color: transparent;
width: 300px;
height: 300px;
perspective: 1000px;
display: inline-block
}
.flip-card-inner {
position: relative;
width: 100%;
height: 100%;
text-align: center;
transition: transform .6s;
transform-style: preserve-3d;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, .2)
}
.flip-card:hover .flip-card-inner {
transform: rotateY(180deg);
-webkit-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
-moz-transform: rotateY(180deg)
}
.flip-card-back,
.flip-card-front {
position: absolute;
width: 100%;
height: 100%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
border-radius: .25rem !important
}
.flip-card-front {
color: #000
}
.flip-card-back {
background-color: var(--bg-color3);
color: #000;
transform: rotateY(180deg);
-webkit-transform: rotateY(180deg);
-ms-transform: rotateY(180deg);
-moz-transform: rotateY(180deg)
}
.titleTop1 {
display: block;
padding: 25px 40px 15px 20px;
border-bottom: 1px solid var(--bg-color1);
margin: -7px 0 -12px
}
.services-home {
position: relative;
margin-top: -65px;
width: 100%;
}
.services-home .service {
box-shadow:0 0 6px 0px #797878;
}
.services-home1 .service h6 {
color: var(--bg-color3)
}
.services-home1 .service:hover h6 {
color: #fff
}
.services-home1 .service:hover a {
border: 1px solid #fff;
color: #fff
}
.hvr-shutter-in-horizontal {
display: inline-block;
vertical-align: middle;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
position: relative;
background: var(--bg-color3);
-webkit-transition-property: color;
transition-property: color;
-webkit-transition-duration: .3s;
transition-duration: .3s
}
.hvr-shutter-in-horizontal:before {
content: "";
position: absolute;
z-index: -1;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: #fff;
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: 50%;
transform-origin: 50%;
-webkit-transition-property: transform;
transition-property: transform;
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
border-radius: 5px
}
.hvr-shutter-in-horizontal:active,
.hvr-shutter-in-horizontal:focus,
.hvr-shutter-in-horizontal:hover {
color: #fff
}
.hvr-shutter-in-horizontal:active:before,
.hvr-shutter-in-horizontal:focus:before,
.hvr-shutter-in-horizontal:hover:before {
-webkit-transform: scaleX(0);
transform: scaleX(0)
}
.efectMissionIcon {
background: var(--bg-color1);
width: 95px;
padding: 10px;
margin-left: -41px;
transition: all .5s ease-in-out !important
}
.efectMission:hover .efectMissionIcon {
background: var(--bg-color2);
transition: all .5s ease-in-out !important;
transform: rotateY(-180deg);
-webkit-transform: rotateY(-180deg);
-ms-transform: rotateY(-180deg);
-moz-transform: rotateY(-180deg)
}
@keyframes appearCaption {
from {
opacity:0;
}
75%{
opacity:0;
}
90%{
opacity: 0.3;
}
95%{
opacity: 0.5;
}
98%{
opacity: 0.7;
}
100%{
opacity: 1;
}
to { 
opacity:1;
}
}
.slit-in-vertical {
-webkit-animation: slit-in-vertical .90s ease-in both;
animation: slit-in-vertical .90s ease-in both
}
@-webkit-keyframes slit-in-vertical {
0% {
-webkit-transform: translateZ(-800px) rotateY(90deg);
transform: translateZ(-800px) rotateY(90deg);
opacity: 0
}
54% {
-webkit-transform: translateZ(-160px) rotateY(87deg);
transform: translateZ(-160px) rotateY(87deg);
opacity: 1
}
100% {
-webkit-transform: translateZ(0) rotateY(0);
transform: translateZ(0) rotateY(0)
}
}
@keyframes slit-in-vertical {
0% {
-webkit-transform: translateZ(-800px) rotateY(90deg);
transform: translateZ(-800px) rotateY(90deg);
opacity: 0
}
54% {
-webkit-transform: translateZ(-160px) rotateY(87deg);
transform: translateZ(-160px) rotateY(87deg);
opacity: 1
}
100% {
-webkit-transform: translateZ(0) rotateY(0);
transform: translateZ(0) rotateY(0)
}
}
.badgeSkew {
white-space: pre-line !important;
border-radius: 0;
-webkit-transform: skewX(-20deg);
-ms-transform: skewX(-20deg);
transform: skewX(-20deg)
}
.btnSkewText {
display: inline-block;
-webkit-transform: skewX(20deg);
-ms-transform: skewX(20deg);
transform: skewX(20deg)
}
.bgImgHover{
overflow: hidden;
position: relative;
}
.bg-img6,.bg-img7{
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
}
.bgImgHover .bg-img6:hover,.bgImgHover .bg-img7:hover {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
}
.sliderServices {
display: flex;
align-items: center;
justify-content: center
}
.sliderServices__item {
display: flex;
align-items: center;
justify-content: center;
flex-basis: 33.33%;
height: 100vh;
font-size: 22px;
line-height: 32px;
text-shadow: 0 0 4px #000;
transition: all .3s
}
.sliderServices__item:hover {
flex-basis: 50%;
color: red !important
}
.ServicesMobil a h3,
.sliderServices__item a h3 {
color: #f5f5f5 !important;
transition: all ease .5s
}
.ServicesMobil:hover a h3,
.sliderServices__item:hover a h3 {
color: #fff !important;
transition: all ease .5s
}
.item-1 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/services/home1.jpg) center center no-repeat;
background-size: cover
}
.item-2 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/services/home2.jpg) center center no-repeat;
background-size: cover
}
.item-3 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/services/home3.jpg) center center no-repeat;
background-size: cover
}
.item-4 {
background: url(//www.sp-plastering.com/wp-content/themes/alpha-theme/source/images/services/home4.jpg) center center no-repeat;
background-size: cover
}
.artist {
color: #fff;
text-decoration: none
}
@media only screen and (max-width:1200px) and (min-width:992px) {
.sliderServices__item {
height: 70vh;
}
}
@media only screen and (max-width:991px) and (min-width:200px) {
.ServicesMobil {
padding: 12% 0; transition: all ease .5s
}
.ServicesMobil:hover {
padding: 20% 0;
transition: all ease .5s
}
.borderDashed{border:none}
}
.carousel-control-next, .carousel-control-prev{bottom: -52px!important;opacity: 1!important; width: 4%; }
.card{background:none!important;}.card-header{padding: 0!important;border-radius:0!important}button,button:focus{border:none!important;text-decoration: none!important;outline: none!important}
button .moreDesc{transform: rotate(45deg); transition: all ease .5s}
button.collapsed .moreDesc{transform: rotate(0deg); transition: all ease .5s};
@media only screen and ( max-width:768px){
.animate_line:after { 
bottom: -5px; 
}
.animate_line:before { 
top: -5px; 
}  
}
.animate_line{
position:relative;
z-index:0;
}
.animate_line:after,
.animate_line:before{
content: "";
height: 4px;
width: 0px;  
position: absolute; 
transition: all 0.5s ease 0s; 
-webkit-transition: all 0.5s ease 0s; 
z-index: -1;    
}
.animate_line:after { 
left: 2px; 
bottom: -15px; 
}
.animate_line:before { 
right: 2px; 
top: -15px; 
}
.animate_line:hover:after, .animate_line:hover:before {
width: 50%;
height: 50%;
background: var(--bg-color3);
}
.animate_line_title h3{
padding-bottom: 11px;
border-bottom: 1px dashed rgb(255, 255, 255);
border-bottom-width: 2px;
transition: all 0.5s ease 0s; 
-webkit-transition: all 0.5s ease 0s; 
}
.animate_line_title:hover h3{
padding-bottom: 11px;
border-bottom: 1px dashed var(--bg-color3);
border-bottom-width: 2px;
transition: all 0.5s ease 0s; 
-webkit-transition: all 0.5s ease 0s; 
} .containerPortfolio {
position: relative;
overflow:hidden;
}
.overlayPortfolio img {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
transition: all 3s ease 0s; 
-webkit-transition: all 3s ease 0s; 
}
.overlayPortfolio:hover img {
-webkit-transform: scale(1.3);
-ms-transform: scale(1.3);
transform: scale(1.3);
transition: all 6s ease 0s!important; 
-webkit-transition: all 6s ease 0s!important; 
} #btnAll,#btnStucco,#btnStone{font-weight: bold;}
#btnAll:hover,#btnStucco:hover,#btnStone:hover{color: var(--bg-color3);}
.activeFilter{color: var(--bg-color4); }
.comment{word-break: break-all;}
.noBreak{display: inline-block!important;}
.formBannerImg{clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%);}
.align-items-center:hover  .flip-horizontal-bottom{-webkit-animation:flip-vertical-fwd .4s cubic-bezier(.455,.03,.515,.955) both;animation:flip-vertical-fwd .4s cubic-bezier(.455,.03,.515,.955) both
} @-webkit-keyframes flip-vertical-fwd{0%{-webkit-transform:translateZ(0) rotateY(0);transform:translateZ(0) rotateY(0)}100%{-webkit-transform:translateZ(160px) rotateY(180deg);transform:translateZ(160px) rotateY(180deg)}}@keyframes flip-vertical-fwd{0%{-webkit-transform:translateZ(0) rotateY(0);transform:translateZ(0) rotateY(0)}100%{-webkit-transform:translateZ(160px) rotateY(180deg);transform:translateZ(160px) rotateY(180deg)}}
.animationFloat{
border-radius: 5px;
-webkit-animation: line 3s ease-in-out infinite;
animation: line 3s ease-in-out infinite;
}
@-webkit-keyframes line {
from {
transform: translateY(4px);
}
50% {
transform: translateY(-4px);
}
to {
transform: translateY(4px);
}
}
@keyframes line {
from {
transform: translateY(4px);
}
50% {
transform: translateY(-4px);
}
to {
transform: translateY(4px);
}
}
.iconHeader{border: 1px dashed var(--bg-color3); border-radius:0px 10px 0 10px; height: 50px; width: 50px; text-align: center;}
@media screen and (max-width:992px) {
.iconHeader{height: 34px; width: 34px; font-size: 26px!important;}
}
@media screen and (max-width:1050px) {
.iconHeader{height: 39px!important; width: 39px!important; font-size: 30px!important;}
}
.btnHeaderMenu{line-height: 4;}
.borderRounded{border-bottom-left-radius: 20px;border-bottom-right-radius: 20px;} .containerServices {
position: relative;width: 100%;
}
.overlayServices {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0, 0, 0, .7);
overflow: hidden;
width: 100%;
height: 0;
transition: .5s ease;
}
.containerServices:hover .overlayServices {
height: 100%;
}
.textServices {
color: white;
font-size: 18px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
text-align: center;
}
@media screen and (max-width:640px) {
.textServices {font-size: 12px;}
}
@media screen and (max-width:800px) {
.textServices p{font-size: 13px!important;}
}
.positionRelative{position: relative;}
.nav-pills{display: inline-flex;
background: var(--bg-color1);
border-radius: 50px;
}
.nav-pills li.active{
padding: 1%;
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link{
background-color: var(--bg-color3);
border-radius: 0px;
}
.pills1:first-child{
border-top-left-radius: 30px!important;
border-bottom-left-radius: 30px!important;
}
.pills3:last-child{
border-top-right-radius: 30px!important;
border-bottom-right-radius: 30px!important;
}
.nav-pills a.nav-link:after{
position: absolute;
left: 50%;
margin-left: -10px;
bottom: -10px;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
content: "";
transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;}
.nav-pills a.nav-link.active:after{
border-top: 10px solid var(--bg-color3);} .pillsMobile1:first-child{
border-top-left-radius: 49px!important;
border-top-right-radius: 49px!important;
}
.pillsMobile3:last-child{
border-bottom-left-radius: 49px!important;
border-bottom-right-radius: 49px!important;
}  #portfolioOverlay{
line-height: 0;  
-webkit-column-count: 2;
-webkit-column-gap:   0px;
-moz-column-count:    2;
-moz-column-gap:      0px;
column-count:         2;
column-gap:           0px;
}
.portfolioOverlay{display: grid!important;}
#portfolioOverlay img { width: 100% !important;
height: auto !important;
}
a.darken {
display: inline-block;
background: #000;
padding: 0;
position:relative;	
}
a.darken img { -webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
}
a.darken:hover:before{
content: '';
display: block;
position: absolute;
width: 90%;
height: 3px;
bottom: 20px;
right: 20px;
background: white;
}
a.darken:hover:after{
content: '';
display: block;
position: absolute;
height: 85%;
width: 3px;
bottom: 20px;
right: 20px;
background: white;
}
a.darken:hover img {
opacity: 0.3;           
}
a.darken span{
visibility:hidden; 
font-size:19px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
line-height: 100%;
}
a.darken:hover span{color:#fff; visibility:visible;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
}
.modal-mobile{position: fixed;bottom:0; z-index: 99;}
#myVideo {
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
width: 100%;
}
.contentSlider {
position: fixed;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
color: #f1f1f1;
width: 100%;
padding: 20px;
}
#video_background {
position: absolute;
bottom: 0px;
right: 0px; 
width: 100%;
z-index: -1000;
overflow: hidden;
}
.heightVideo{ height: 500px;}
@media only screen and (min-width:200px) { .heightVideo{ height: 177px;}}
@media only screen and (min-width:768px) { .heightVideo{ height: 363px;}}
@media only screen and (min-width:992px) { .heightVideo{ height: 380px;}}
@media only screen and (min-width:1024px) { .heightVideo{ height: 580px;}}
.row-flex{
display: -webkit-box!important;
display: -webkit-flex!important;
display: -ms-flexbox!important;
display:         flex!important;
flex-wrap: wrap!important;
}
.row-flex > [class*='col-'] {
display: flex!important;
flex-direction: column!important;
}
.contentServices1 {height: 100%!important;}
@media only screen and (max-width:435px) and (min-width:200px) { 
.top-slider1{margin-top: -295px;
position: relative;
z-index: 0;}
}
.servicesForm {
margin-top: -39px;
margin-left: 25px;
padding: 10px;
}
img.bg-color2:hover{background: var(--bg-color3)!important;}
img.bg-color3:hover{background: var(--bg-color2)!important;}
.missionDecorative:before{content:'';height:4em;width:4em;border-top:.8em solid var(--bg-color2);border-left:.8em solid var(--bg-color2);position:absolute;top:-1.5em;left:1.5em}
.missionDecorative:after{content:'';height:4em;width:4em;border-top:.8em solid var(--bg-color2);border-right:.8em solid var(--bg-color2);position:absolute;top:-1.5em;right:1.5em}
.servicesBG{top: 121px; position: absolute; left: 0;}
.Zindex{z-index:1 ;}
.gmap-here{height: 520px; position: relative; overflow: hidden;}
.mapHome{height: 100%; width: 100%; position: relative; left: 0px; z-index: -1!important; }
.infoBox{height: 220px;padding: 5%;}
.infoIcon{margin-top: -45px; margin-left: 25px; padding: 10px;position: absolute;}
.positionAbsoluteInfo{top: 430px;position: absolute;}
@media only screen and (max-width:767px) and (min-width:200px) { 
.positionAbsoluteInfo{top: 0px; position: relative;}
}
#services-section {margin-top:-100px;}
.icon {margin-top:-50px;margin-bottom:-50px;}
.services-item .normal{background:var(--bg-color3);}
.services-item .inverted{background:var(--bg-color1);}
#footer p { color: #fff !important;
line-height: 1.3;
text-align: center;
}
#footer p a {
color: var(--bg-color3) !important
}
#footer p a :hover {
text-decoration: none
}
#footer h2 {
font-size: 2.3em!important;
color: #fff !important;
}
#footer ul li {
color: #fff !important;
margin-bottom: 0.5em
}
#footer ul li a {
color: #fff !important
}
#footer ul li a:hover {
text-decoration: none !important
}
#footer ul li i {
margin-right: 5px;
min-width: 18px;
text-align: center;
}
#footer .social-icons {
text-align: center
}
#footer .social-icons li {
display: inline
}
#footer .social-icons li a {
font-size: 2.5em
}
.copyright {
background: #000000
}
.copyright p {
color: #fff !important;
font-size: 15px;
}
.copyright p a {
color: var(--bg-color3) !important
}
.copyright p a:hover {
text-decoration: none !important
}
#portfolio-section .title-polygon {
background: var(--bg-color3);
height: 30px;
width: 70px;
clip-path: polygon(50% 100%, 0 0, 100% 0);
margin-bottom: -53px;
margin-left: auto;
margin-right: auto
}
#portfolio-section .title {
background: var(--bg-color3)
}
#portfolio-section .title h2 {
font-size: 3.2em !important;
color: #fff;
font-family: "Geogtq-Black" !important
}
#portfolio-section #portfolio-images .content {
position: relative;
width: 100%;
max-width: 100%;
margin: auto;
overflow: hidden
}
#portfolio-section #portfolio-images .content .content-overlay {
background: var(--bg-color2)78;
position: absolute;
height: 100%;
width: 100%;
left: 0;
top: 0;
bottom: 0;
right: 0;
opacity: 0;
-webkit-transition: all 0.4s ease-in-out 0s;
-moz-transition: all 0.4s ease-in-out 0s;
transition: all 0.4s ease-in-out 0s
}
#portfolio-section #portfolio-images .content:hover .content-overlay {
opacity: 1
}
#portfolio-section #portfolio-images .content-image {
width: 100%
}
#portfolio-section #portfolio-images .content-details {
position: absolute;
text-align: center;
padding-left: 1em;
padding-right: 1em;
width: 100%;
top: 50%;
left: 50%;
opacity: 0;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: all 0.3s ease-in-out 0s;
-moz-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s
}
#portfolio-section #portfolio-images .content:hover .content-details {
top: 50%;
left: 50%;
opacity: 1
}
#portfolio-section #portfolio-images .content-details p i {
color: #fff;
font-size: 3.8em
}
#portfolio-section #portfolio-images .fadeIn-bottom {
top: 80%
}
#portfolio-section #portfolio-images .fadeIn-top {
top: 20%
}
#portfolio-section #portfolio-images .fadeIn-left {
left: 20%
}
#portfolio-section #portfolio-images .fadeIn-right {
left: 80%
}
.ekko-lightbox-nav-overlay{position:absolute;bottom:4%;background:rgba(255,255,255,0.7);border-radius:5px;);left:49%;padding-top:2px;padding-bottom:2px;}
.ekko-lightbox-nav-overlay a{padding-left:5px;padding-right:5px;}
#breadcrumbs .title {
font-size: 30px;
margin-bottom: 5px
}
.logo-internal{width:150px;}
.modal-mobile{position: fixed;bottom:0; z-index: 99;}
.navbar-dark .navbar-nav .nav-link{color:#fff;}
div[style="height:100%;width:100%;overflow:auto;"]{overflow-x:hidden!important;}
.badge{font-size: 90%!important;padding-top: 5px!important;padding-bottom: 5px!important;font-weight:strong;}
.bg-light{background:#eeeeee!important;}