@charset "utf-8";
/*************OKNO**********************/
.box-modal {    
    width: 708px;
    height: auto;
    background: #f2f2f2;
    border-radius: 10px;
    padding: 10px;
}
.modal-content-box .fca_top {
    position: relative;
    width: 600px;
    margin: auto;
    max-height: 165px;
    padding-top: 10px;
}
.fca_top .fca_image {
    display: inline-block;
    vertical-align: top;
    width: 124px;
    height: 124px;
}
.fca_top .fca_message {
    width: 426px;
    margin-left: 40px;
    position: relative;
    display: inline-block;
    vertical-align: top;
}
.fca_top .fca_message #fca_header {
    margin-bottom: 20px;
    font-size: 26px;
    font-weight: 400;
}
.fca_top .fca_message div {
    font-weight: lighter;
    font-size: 22px;
}
.fca_fields {
    width: 600px;
    position: relative;
    margin: 30px auto auto;
}
.fca_phone_ico {
    position: absolute;
    left: -40px;
    top: 7px;
    margin-right: 7px;
    width: 28px;
    height: 31px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAfCAYAAAD0ma06AAAACXBIW…1+m2rUbWONTUZt9mI0789Mu5rC3bhKWBnL34/Ygebo3wBwyFy3Z3TWUAAAAABJRU5ErkJggg==);
    display: inline-block;
}
.fca_fields input[type=button] {
    border-radius: 5px;
    background-clip: padding-box;
    background-color: #12a0f1;
    color: #fff!important;
    border: none;
    border-left: 1px solid #368736;
    border-bottom: 1px solid #368736;
    font-size: 18px!important;
    margin: 0 -3px;
    cursor: pointer;
    width: 180px;
    height: 40px!important;
    text-align: center;
    box-shadow: none;
    text-shadow: none;
    display: inline-block;
    float: none;
    background-image: none;
    vertical-align: top;
}
.fca_fields input[type=text], .fca_fields select {
    vertical-align: top;
    margin-right: 5px;
    max-width: none;
    min-width: 0;
    width: 200px;
    border: 1px solid #ccc;
    height: 40px;
    font-size: 18px;
    box-shadow: inset 1px 2px 6px 0 rgba(100, 100, 100, .5);
    color: #34495e;
    /*text-indent: 8px;*/
    border-radius: 5px;
    font-weight: 400;
    display: inline-block;
}
.add-on .fa-phone:before {
    content: "\f095";
    font-size: 3em;
    color: #12a0f1;;
}
.input-append .add-on, .input-prepend .add-on{
	border: none;
}
.fca_fields input[type=text] {
	padding: 0px 6px;
}
/***************кнопка************************/
.dws {
 /* position: absolute;
 top: 50%;
 left: 50%; */
 transform: translate(-50%, -50%);
 z-index: 999;
}
.pulse, .bloc, .phone {
 position: absolute;
 width: 90px;
 height: 90px;
 color: #fff;
 text-align: center;
 border-radius: 50%;
}
.bloc {
 cursor: pointer;
 z-index: 1;
 overflow: hidden;
}
.pulse {
 background: #5CC2E2;
 position: relative;
 transition: .5s;
}
.phone {
 font-size: 50px;
 line-height: 94px;
 animation: phone .9s ease-in-out infinite;
}
.text {
 position: absolute;
 opacity: 0;
 text-transform: uppercase;
 font-weight: 700;
 top: 28px;
 font-size: 15px;
 transform: scaleX(-1);
 transition: .5s ease-in-out;
}
.phone i {
 transition: .5s ease-in-out;
}
.pulse:hover {
 background: #29AEE3;
}
.pulse:hover i {
 transition: .5s ease-in-out;
 transform: scale(0);
}
.pulse:hover .text {
 transform: scaleX(1);
 transition: .5s ease-in-out;
 opacity: 1;
}
.pulse:hover::before,
.pulse:hover::after {
 content: '';
 position: absolute;
 border: 1px solid #29AEE3;
 left: -20px;
 right: -20px;
 top: -20px;
 bottom: -20px;
 border-radius: 50%;
 animation: pulse 1.8s linear infinite;
 opacity: 0;
}
.pulse:hover::after {
 animation-delay: .5s;
}

@keyframes phone {
 0%, 100% {
  transform: rotate(-20deg);
 }
 50% {
  transform: rotate(21deg);
 }
}
@keyframes pulse {
 0% {
  transform: scale(0.5);
  opacity: 0;
 }
 50% {
  opacity: 1;
 }
 100% {
  transform: scale(1.2);
  opacity: 0;
 }
}
