#cont-all {
  margin: 0;
  padding: 303px 0 0 0;
  background: #eee url(contacts/top2.jpg) no-repeat 0 0;
  position: relative;
}

#cont-allpin {
  position: absolute;
  width: 228px;
  height: 219px;
  background: url(contacts/top2p.png) no-repeat 0 0;
  top: 50px;
  left: 336px;
  -webkit-animation: pin-showup 1.7s;
  animation: pin-showup 1.7s;
}

@-webkit-keyframes pin-showup { 
  0% {opacity:0;-webkit-transform:scale(.01,.01);} 
  70% {opacity:0;-webkit-transform:scale(.01,.01);} 
  80% {opacity:1;-webkit-transform:scale(.1,.1);} 
  90% {opacity:1;-webkit-transform:scale(1.1,1.1);} 
  100% {opacity:1;-webkit-transform:scale(1,1);} 
}
@keyframes pin-showup { 
  0% {opacity:0;transform:scale(.01,.01);} 
  70% {opacity:0;transform:scale(.01,.01);} 
  80% {opacity:1;transform:scale(.1,.1);} 
  90% {opacity:1;transform:scale(1.1,1.1);} 
  100% {opacity:1;transform:scale(1,1);} 
}

#cont-form {
  text-align: center;
  position: absolute;
  top: 20px;
  left: 20px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  padding: 7px;
  background: #000;
  background: rgba(0,0,0,.2);
  -webkit-animation: cont-form 2.5s;
  animation: cont-form 2.5s;
}

#cont-form textarea {
  display: block;
  width: 200px;
  height: 200px;
  padding: 5px;
  background: #000;
  background: rgba(0,0,0,.65);
  border: 1px solid rgba(0,0,0,.3);
  -moz-border-radius: 2px;
  border-radius: 2px;
  color: #eee;
  font: 12pt/13pt Arial;
  text-align: left;
  text-shadow: 0 0 3px rgba(255,255,255,.5);
  text-decoration: none;
  margin: 0 0 7px 0;
  -moz-box-shadow: 0 0 80px 5px #000 inset;
  -webkit-box-shadow: 0 0 80px 5px #000 inset;
  box-shadow: 0 0 80px 5px #000 inset;
}

#cont-form-hint {
  pointer-events: none;
  position: absolute;
  top: 40px;
  left: 30px;
  right: 30px;
  color: #ccc;
  font: 12pt/13pt Arial;
  text-align: left;
  text-shadow: 0 0 3px rgba(255,255,255,.5);
  text-decoration: none;
  text-indent: 20px;
  background: url(/images/btnforum.png) no-repeat 0 0;
}

#cont-form-hint.ok {
  background: url(/images/g.png) no-repeat 0 0;
}

#cont-form-hint a {
  display: block;
  margin-top: 10px;
  height: 36px;
  background: url(/images/whatsapp.png) no-repeat 0 -2px;
  padding: 0 0 0 20px;
  font: bold 13pt/33px Arial;
  text-decoration: none;
  color: #eee;
}

#cont-addr {
  position: absolute;
  padding: 0;
  top: 47px;
  right: 20px;
  width: 300px;
  height: 209px;
  background: url(contacts/env.jpg) no-repeat 0 0;
  -moz-box-shadow: 5px 10px 40px rgba(0,0,0,.25);
  -webkit-box-shadow: 5px 10px 40px rgba(0,0,0,.25);
  box-shadow: 5px 10px 40px rgba(0,0,0,.25);
  -moz-border-radius: 1px;
  border-radius: 1px;
  -webkit-animation: cont-addr 2.5s;
  animation: cont-addr 2.5s;
}

#cont-addr:after {
  content: '';
  position: absolute;
  width: 121px;
  height: 121px;
  background: url(/images/seal.png) no-repeat 0 0;
  left: 10px;
  bottom: 0;
}

#cont-addr b {
  position: absolute;
  text-align: center;
  top: 10px;
  left: 0;
  right: 0;
  color: #333;
  color: rgba(15,10,0,.6);
  text-shadow: 1px 1px 1px rgba(255,255,255,.3);
  padding: 0 40px;
  font: bold 12pt/14pt Arial;
}

#cont-addr span {
  position: absolute;
  right: 10px;
  bottom: 7px;
  color: #222;
  color: rgba(0,0,0,.8);
  font: 11pt/12pt Arial;
  text-align: right;
  text-shadow: 1px 1px 1px rgba(255,255,255,.3);
  text-decoration: none;
}

@-webkit-keyframes cont-form {
  0% { opacity:0; left:-200px; }
  90% { opacity:0; left:-50px; }
  100% { opacity:1; left:20px; }
}
@keyframes cont-form {
  0% { opacity:0; left:-200px; }
  90% { opacity:0; left:-50px; }
  100% { opacity:1; left:20px; }
}
@-webkit-keyframes cont-addr {
  0% { opacity:0; right:-200px; }
  90% { opacity:0; right:-50px; }
  100% { opacity:1; right:20px; }
}
@keyframes cont-addr {
  0% { opacity:0; right:-200px; }
  90% { opacity:0; right:-50px; }
  100% { opacity:1; right:20px; }
}

#cont-pp {
  display: block;
  margin: 0;
  padding: 0;
  vertical-align: top;
}

div.cl {
  display: inline-block;
  width: 425px;
  padding: 10px;
  vertical-align: top;
}

div.cr {
  display: inline-block;
  width: 425px;
  padding: 10px;
  vertical-align: top;
}

#cont-pp p {
  display: block;
  font: 14px/15px Arial;
  text-shadow: 0 1px 1px rgba(0,0,0,.08);
}

#cont-pp p.h {
  display: inline-block;
  background: #787570;
  margin: 0;
  padding: 3px 7px;  
  -moz-border-radius: 2px;
  border-radius: 2px;
  color: #eee;
  font: bold 14px/14px Arial;
}

#cont-pp p.i {
  display: block;
  position: relative;
  margin: 0;
  padding: 0 0 5px 20px;
}

#cont-pp p.i:before {
  content:'';
  position: absolute;
  top: 1px;
  left: 0;
  width: 14px;
  height: 14px;
  background: #787570;
  -moz-border-radius: 7px;
  border-radius: 7px;
}

#cont-blocks {
  display: block;
  height: 300px;
  overflow: hidden;
  position: relative;
  background: url(contacts/social.png) no-repeat center center;
}

#cont-blocks span {
  position: absolute;
  top: 0;
  left: 0;
}

@-webkit-keyframes cont-block {
  0% { top:-300px; }
  95% { top:-300px; }
  100% { top:0px; }
}
@keyframes cont-block {
  0% { top:-300px; }
  95% { top:-300px; }
  100% { top:0px; }
}

.cont-block {
  position: absolute;
  top: 0;
  left: 0;
  width: 300px;
  height: 300px;
  background: none;
  text-decoration: none;
  -webkit-transform:scale(.9,.9);
  transform:scale(.9,.9);
}

@-webkit-keyframes cont-block-hover {
  0% { -webkit-transform:scale(.9,.9); }
  100% { -webkit-transform:scale(1,1); }
}
@keyframes cont-block-hover {
  0% { transform:scale(.9,.9); }
  100% { transform:scale(1,1); }
}

.cont-block:before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0,0,0,.15);
  box-shadow: 0 0 150px 0 rgba(0,0,0,.3) inset;
}

.cont-block:hover:before {
  opacity: 0;
}

.cont-block i {
  position: absolute;
  top: 175px;
  right: 40px;
  left: 40px;
  background: #556 url(/images/btnf.png) no-repeat right bottom;
  padding: 10px 20px 10px 10px;
  font: bold 11pt/13pt Arial;
  color: #eee;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: 0 2px 20px rgba(0,0,0,.3);
  -webkit-box-shadow: 0 2px 20px rgba(0,0,0,.3);
  box-shadow: 0 2px 20px rgba(0,0,0,.3);
  text-shadow: 0 0 2px rgba(0,0,0,.5);
}

#cont-group {
  background: url(contacts/cont1.jpg) no-repeat 0 0;
}

#cont-insta {
  background: url(contacts/cont2.jpg) no-repeat 0 0;
  left: 300px;
}

#cont-fb {
  background: url(contacts/cont3.jpg) no-repeat 0 0;
  left: 600px;
}

#cont-blocks .s1 {
  -webkit-animation: cont-block 5.3s;
  animation: cont-block 5.3s;
}
#cont-blocks .s2 {
  -webkit-animation: cont-block 5.5s;
  animation: cont-block 5.5s;
}
#cont-blocks .s3 {
  -webkit-animation: cont-block 5.7s;
  animation: cont-block 5.7s;
}

#cont-blocks .cont-block:hover {
  -webkit-animation: cont-block-hover 0.1s;
  animation: cont-block-hover 0.1s;
  -webkit-transform:scale(1,1);
  transform:scale(1,1);
  z-index: 1;
}

.cont-sep {
  position: relative;
  clear: both;
  background: #585858 url('/images/mnav.gif') repeat-x;
  height: 22px;
  border-bottom: 1px solid #484848;
  padding: 4px 0 0 0;
  margin: 0;
  text-align: center;
  font: 18px/20px Arial;
  letter-spacing: 0px;
  color: #ccc;
  color: rgba(255,255,255,.8);
  text-shadow: 0 1px 1px rgba(0,0,0,.3);
  -moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
  box-shadow: 0 1px 2px rgba(0,0,0,.15);
  z-index: 1;
}

.cont-sep:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-image:-moz-linear-gradient(0deg, transparent, rgba(255,255,255,.07) 35%, rgba(255,255,255,.07) 65%, transparent);
  background-image:-webkit-linear-gradient(0deg, transparent, rgba(255,255,255,.07) 35%, rgba(255,255,255,.07) 65%, transparent);
  background-image:-o-linear-gradient(0deg, transparent, rgba(255,255,255,.07) 35%, rgba(255,255,255,.07) 65%, transparent);
  background-image:-ms-linear-gradient(0deg, transparent, rgba(255,255,255,.07) 35%, rgba(255,255,255,.07) 65%, transparent);
  background-image: linear-gradient(90deg, transparent, rgba(255,255,255,.07) 35%, rgba(255,255,255,.07) 65%, transparent);
}

