.elementor-11 .elementor-element.elementor-element-3920285{--display:flex;--min-height:100vh;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for html, class: .elementor-element-207bdef */.header_ripple {
background-image: url('/wp-content/assets/images/contact_background.jpg');
background-color:transparent;
background-repeat:no-repeat;
background-size:cover;
background-position: center;
height: 100vh;
margin-top: 150px;
}
:root {
--bg: transparent;
--primary: grey;
--solid: #000;
--btn-w: 7em;
--dot-w: calc(var(--btn-w)*.34);
--tr-X: calc(var(--btn-w) - var(--dot-w));
}
* {box-sizing: border-box;}
*:before, *:after {box-sizing: border-box;}

.btn {
position: relative;
top: 75vh;
margin: 0 auto;
width: var(--btn-w);
color: var(--primary);
border: .15em solid var(--primary);
border-radius: 5em;
text-transform: uppercase;
text-align: center;
font-size: 1.3em;
line-height: 2em;
cursor: pointer;



}
.dot {
content: '';
position: absolute;
top: 0;
width: var(--dot-w);
height: 100%;
border-radius: 100%;
transition: all 300ms ease;
display: none;
}
.dot:after {
content: '';
position: absolute;
left: calc(50% - .4em);
top: -.4em;
height: .8em;
width: .8em;
background: var(--primary);
border-radius: 1em;
border: .25em solid var(--solid);
box-shadow: 0 0 .7em var(--solid),
0 0 2em var(--primary);
background-color: red;
}
.dot,
.btn:focus .dot {
animation: click 5s infinite linear;
display: block;
}
.btn:hover {
transform: translateY(-3px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.btn:active {
transform: translateY(-1px);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

.btn:hover::after {
transform: scaleX(1.4) scaleY(1.6);
opacity: 0;
}

.btn-animated {
animation: moveInBottom 5s ease-out;
animation-fill-mode: backwards;
}

@keyframes moveInBottom {
0% {
opacity: 0;
transform: translateY(30px);
}

100% {
opacity: 1;
transform: translateY(0px);
}
}
@keyframes click {
0% {transform: translateX(0) rotate(0);}
30%{transform: translateX(var(--tr-X)) rotate(0);}
50% {transform: translateX(var(--tr-X)) rotate(180deg);}
80% {transform: translateX(0) rotate(180deg);}
100% {transform: translateX(0) rotate(360deg);}
}/* End custom CSS */