.call-content{display:grid;width:100%;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));}
.call-content .item-call{display:grid;grid-template-rows:1fr min-content;align-items:center;justify-content:center;flex-wrap:wrap;background:var(--bg-color);}
.call-content .item-call:not(.footer){padding-top:1rem;}
.lan_btn_anim{background:transparent;color:#0072b6;border:2px solid #ea178c;border-radius:50px;padding:0.8rem 2rem;font:24px "Margarine", sans-serif;outline:none;cursor:pointer;position:relative;transition:0.2s ease-in-out;letter-spacing:2px;}
.name-call{width:100%;text-align:center;padding:0 0 3rem;font:500 14px 'Rubik', sans-serif;letter-spacing:.5px;text-transform:uppercase;text-shadow:0 1px 1px rgba(0, 0, 0, 0.4);}
.button__wrapper{display:inline-block;position:relative;width:200px;height:65px;display:flex;justify-content:center;align-items:center;}
.button-pulse button{background:var(--bg-color);width:100%;height:100%;position:absolute;top:0;left:0;z-index:2;}
.button-pulse .button__wrapper:hover .pulsing:before{animation:pulsing 0.2s linear infinite;}
.button-pulse .button__wrapper:hover .pulsing:after{animation:pulsing1 0.2s linear infinite;}
.pulsing{width:99%;height:99%;border-radius:50px;z-index:1;position:relative;}
.pulsing:before, .pulsing:after{width:100%;height:100%;border:inherit;top:0;left:0;z-index:0;background:#fff;border-radius:inherit;animation:pulsing 2.5s linear infinite;}
.pulsing:after{animation:pulsing1 2.5s linear infinite;}
@keyframes pulsing {
0%{opacity:1;transform:scaleY(1) scaleX(1);}
20%{opacity:0.5;}
70%{opacity:0.2;transform:scaleY(1.8) scaleX(1.4);}
80%{opacity:0;transform:scaleY(1.8) scaleX(1.4);}
90%{opacity:0;transform:scaleY(1) scaleX(1);}
}
@keyframes pulsing1 {
0%{opacity:1;transform:scaleY(1) scaleX(1);}
20%{opacity:0.5;}
70%{opacity:0.2;transform:scaleY(1.3) scaleX(1.15);}
80%{opacity:0;transform:scaleY(1.3) scaleX(1.15);}
90%{opacity:0;transform:scaleY(1) scaleX(1);}
}
.button-typewriter button{width:100%;height:100%;}
.button-typewriter p{animation:typing 4s steps(12) infinite;display:inline-block;overflow:hidden;white-space:nowrap;}
.button-typewriter .button__wrapper:hover p{animation:blink 0.3s infinite;}
@keyframes typing {
0%{width:0;}
50%{width:100%;}
55%,
65%,
75%{opacity:1;}
60%,
70%{opacity:0;}
80%{width:100%;}
100%{width:0;}
}
.button-parrot .parrot{position:absolute;width:60px;text-align:center;animation:blink 0.8s infinite;color:transparent;}
.button-parrot .parrot:before{content:"Click Me!";}
.button-parrot .parrot:nth-child(1){top:-30px;left:-40px;font:12px/1 "Margarine", sans-serif;transform:rotate(-20deg);animation-duration:0.5s;}
.button-parrot .parrot:nth-child(2){font:12px/1 "Margarine", sans-serif;right:-40px;top:-20px;transform:rotate(15deg);animation-duration:0.3s;}
.button-parrot .parrot:nth-child(3){font:16px/1 "Margarine", sans-serif;top:-60px;left:15px;transform:rotate(10deg);animation-duration:1s;}
.button-parrot .parrot:nth-child(4){font:18px/1 "Margarine", sans-serif;top:-70px;left:95px;transform:rotate(2deg);animation-duration:0.7s;}
.button-parrot .parrot:nth-child(5){font:14px/1 "Margarine", sans-serif;top:80px;left:105px;transform:rotate(-20deg);animation-duration:0.8s;}
.button-parrot .parrot:nth-child(6){font:12px/1 "Margarine", sans-serif;top:80px;left:5px;transform:rotate(10deg);animation-duration:1.2s;}
.button-parrot button:hover .parrot:before{content:"Do it!";width:70px;}
@keyframes blink {
25%,
75%{color:transparent;}
40%,
60%{color:#fff;}
}
.button-hand button:before{content:"👇";font-size:60px;transform:scaleX(-1);right:0px;top:-68px;animation:up-down 1s infinite;}
.button-hand button .hands:before, .button-hand button .hands:after{content:"👇";font-size:40px;opacity:0;transition:0.4s ease-in-out;}
.button-hand button .hands:before{transform:rotate(-60deg);left:-45px;top:-10px;}
.button-hand button .hands:after{transform:rotate(170deg);right:30px;top:50px;}
.button-hand button:hover .hands:before{opacity:1;left:-35px;}
.button-hand button:hover .hands:after{opacity:1;top:40px;}
@keyframes up-down {
50%{margin-top:-20px;}
}
.button-100 .emoji{position:absolute;top:-45px;left:0;width:35px;height:35px;overflow:hidden;}
.button-100 .emoji:before{content:"💯";display:inline-block;animation:give-score 2.5s infinite;position:relative;top:0;}
.button-100 .emoji:nth-child(2){left:0;right:0;margin:auto;}
.button-100 .emoji:nth-child(2):before{animation:give-score 2.5s infinite 0.2s;}
.button-100 .emoji:nth-child(3){left:auto;right:0;}
.button-100 .emoji:nth-child(3):before{animation:give-score 2.5s infinite 0.4s;}
.button-100 button:hover .emoji:before{content:"👏";transition:0.5s ease;}
@keyframes give-score {
30%,
80%{top:0;}
40%,
70%{top:50px;}
}
.button-pressure marquee{position:absolute;width:90%;top:125%;left:5%;font:18px/1 "Margarine", sans-serif;}
.button-pressure marquee span{display:inline-block;height:20px;}
.button-pressure marquee span:not(:last-child){margin-right:130px;}
.button-pressure button:before{content:"OMG YAS";transition:0.5s ease;left:0;right:0;margin:auto;top:-15px;font-size:12px;opacity:0;}
.button-pressure button:hover:before{animation:omg-yes 1s;}
.button-rainbow button{animation:rainbow 3s infinite, heartbeat 0.6s infinite;background:#c0392b;}
.button-rainbow button .rainbow{width:120px;height:120px;border-radius:50%;position:absolute;left:0;right:0;margin:auto;top:-40px;transition:0.5s ease;opacity:0;transform:rotate(0);}
.button-rainbow button .rainbow:before{content:"🌈";left:0;}
.button-rainbow button:hover .rainbow{opacity:1;animation:rotate-nonstop 0.2s infinite;}
.button-rainbow button + .name-call{color:#444;}
@keyframes rotate-nonstop {
50%{transform:rotate(92deg);}
}
@keyframes omg-yes {
50%{opacity:1;}
100%{top:-50px;}
}
@keyframes rainbow {
0%{background:#1abc9c;}
10%{background:#2ecc71;}
20%{background:#3498db;}
30%{background:#9b59b6;}
40%{background:#e74c3c;}
50%{background:#e67e22;}
60%{background:#f1c40f;}
70%{background:#2c3e50;}
80%{background:#9b59b6;}
}
.button-jittery button{}
.button-jittery button:hover{animation:heartbeat 0.9s infinite;}
@keyframes jittery {
5%,
50%{transform:scale(1);}
15%{transform:scale(1.15);}
20%{transform:scale(1.15) rotate(-5deg);}
25%{transform:scale(1.15) rotate(5deg);}
30%{transform:scale(1.15) rotate(-3deg);}
35%{transform:scale(1.15) rotate(2deg);}
40%{transform:scale(1.15) rotate(0);}
}
@keyframes heartbeat {
50%{transform:scale(1.1);}
}
.item-call.footer{flex-wrap:wrap;padding:5rem;text-align:center;font-size:18px;line-height:1.7;grid-column:span 1;}
@media screen and (min-width: 823px) and (max-width: 1223px) {
.item-call.footer{grid-column:span 2;}
}
.item-call.footer a{text-decoration:none;color:#fff;padding:3px 0;border-bottom:1px dashed;}
.item-call.footer a:hover{border-bottom:1px solid;}
footer{margin-top:1.5rem;}
footer a{text-decoration:none;display:inline-block;width:45px;height:45px;border-radius:50%;background:transparent;border:1px dashed #fff;color:#fff;margin:5px;}
footer a:hover{background:rgba(255, 255, 255, 0.1);}
footer a .icons{margin-top:8px;display:inline-block;font-size:20px;}
footer a .icons:before {
position: relative;
}.container_contact{border:1px solid #a7a7a7;border-radius:20px;margin:0 auto;max-width:760px;}
input:focus ~ label, textarea:focus ~ label, input:valid ~ label, textarea:valid ~ label{font-size:0.75em;color:#999;top:-5px;-webkit-transition:all 0.225s ease;transition:all 0.225s ease;}
.styled-input{float:left;width:100%;margin:1rem 0;position:relative;border-radius:4px;}
@media only screen and (max-width: 768px){
.styled-input{width:100%;}
}
.site-heading-h4{padding-right:5px;padding-left:5px;}
.spn_btn_close{color:#60626d;font-size:15px;}
.spn_btn_close_up{font-size:28px;}
.popup_contact{margin-top:20px;}
#popup_contact_2{margin-bottom:15px;}
@media only screen and (max-width: 1200px){
#popup_contact_1{display:none;}
#popup_contact_2{display:block;}
}
@media only screen and (min-width: 1200px){
#popup_contact_2{display:none;}
#popup_contact_1{display:block;}
}
.styled-input label{color:#999;padding:1.3rem 30px 1rem 30px;position:absolute;top:5px;left:0;-webkit-transition:all 0.25s ease;transition:all 0.25s ease;pointer-events:none;width:100%;text-align:right;font-weight:300;font-size:24px;}
.styled-input.wide{width:650px;max-width:100%;}
input,
textarea{padding:25px;border:0;width:100%;height:70px;font-size:2rem;background-color:#fff;color:#000;border-radius:20px;border:1px solid #16254f;}
input:focus,
textarea:focus{outline:0;}
input:focus ~ span,
textarea:focus ~ span{width:100%;-webkit-transition:all 0.075s ease;transition:all 0.075s ease;}
textarea{width:100%;min-height:15em;}
.input-container{width:650px;max-width:100%;margin:0px auto 0px auto;padding:10px;}
.submit-btn{text-align:center;float:right;padding:7px 25px;border-radius:60px;display:inline-block;background-color:#16254f;color:white;font-size:28px;cursor:pointer;box-shadow:0 2px 5px 0 rgba(0,0,0,0.06), 0 2px 10px 0 rgba(0,0,0,0.07);-webkit-transition:all 300ms ease;transition:all 300ms ease;width:100%;height:60px;}
.submit-btn:hover{transform:translateY(1px);box-shadow:0 1px 1px 0 rgba(0,0,0,0.10), 0 1px 1px 0 rgba(0,0,0,0.09);}
@media (max-width: 768px) {
.submit-btn{width:100%;float:none;text-align:center;}
.col-xs-12{padding:0;}
}
input[type=checkbox] + label{color:#ccc;font-style:italic;}
input[type=checkbox]:checked + label{color:#f00;font-style:normal;}
.lan_cust_ex{color:#fff;font-size:18px;padding-top:10px;}
.lan_err{
text-align: left !important;
color: #a00000 !important;
font-size: 16px !important;
visibility: hidden;
}@media only screen and (min-width: 780px) {
#callme{display:none;}
}
#callme{position:fixed;right:20px;bottom:10px;width:70px;height:70px;cursor:pointer;opacity:0.5;z-index:99990;}
#callme #callmeMain{-moz-border-radius:50% !important;-webkit-border-radius:50% !important;border-radius:50% !important;-moz-background-clip:padding;-webkit-background-clip:padding-box;background-clip:padding-box;background-color:rgb(0, 114, 182);width:70px;height:70px;-webkit-animation:zcwmini2 1.5s 0s ease-out infinite;-moz-animation:zcwmini2 1.5s 0s ease-out infinite;animation:zcwmini2 1.5s 0s ease-out infinite;}
#callme #callmeMain:before{content:"";position:absolute;width:100%;height:100%;top:0;left:0;background-image:url(https://ss.zadarma.com/callbackWidget/images/mini.png);background-repeat:no-repeat;background-position:center center;-webkit-animation:zcwphone2 1.5s linear infinite;-moz-animation:zcwphone2 1.5s linear infinite;animation:zcwphone2 1.5s linear infinite;}
@-webkit-keyframes zcwphone {
0%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
25%{-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
50%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
75%{-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
100%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@-moz-keyframes zcwphone {
0%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
25%{-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
50%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
75%{-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
100%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@keyframes zcwphone {
0%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
25%{-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
50%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
75%{-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
100%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@-webkit-keyframes zcwphone2 {
0%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
25%{-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
50%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
75%{-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
100%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@-moz-keyframes zcwphone2 {
0%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
25%{-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
50%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
75%{-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
100%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@keyframes zcwphone2 {
0%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
25%{-ms-transform:rotate(30deg);-webkit-transform:rotate(30deg);transform:rotate(30deg);}
50%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
75%{-ms-transform:rotate(-30deg);-webkit-transform:rotate(-30deg);transform:rotate(-30deg);}
100%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}
}
@-webkit-keyframes zcwmini {
0%{box-shadow:0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
10%{box-shadow:0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px;}
100%{box-shadow:0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}
@-moz-keyframes zcwmini {
0%{box-shadow:0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
10%{box-shadow:0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px;}
100%{box-shadow:0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}
@keyframes zcwmini {
0%{box-shadow:0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
10%{box-shadow:0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px;}
100%{box-shadow:0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}
@-webkit-keyframes zcwmini2 {
0%{box-shadow:0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
10%{box-shadow:0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px;}
100%{box-shadow:0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}
@-moz-keyframes zcwmini2 {
0%{box-shadow:0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
10%{box-shadow:0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px;}
100%{box-shadow:0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}
@keyframes zcwmini2 {
0% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 0 rgba(0,0,0,0), 0 0 0 0 rgba(207,8,8, 0);}
10% {box-shadow: 0 0 8px 6px , 0 0 12px 10px rgba(0,0,0,0), 0 0 12px 14px ;}
100% {box-shadow: 0 0 8px 6px rgba(207,8,8, 0), 0 0 0 40px rgba(0,0,0,0), 0 0 0 40px rgba(207,8,8, 0);}
}