/* GERAIS */
/***********************************************/
* { /*margin:0; padding:0;*/ }
html { height:100%; }
body { width: 100%; min-height: 100%; height:100%; margin:0px; padding: 0px; font-family: 'Lato', sans-serif; font-size: 20px; line-height: 30px; font-weight: 300; background: #FFFFFF !IMPORTANT; color: #333333; }
img { border-style: none; }
a:visited, a:link, a:active { color: #F16521; text-decoration:none; outline: none; }
a:hover { color: #F16521; text-decoration:underline; outline: none;	}
textarea { overflow: auto; }
form { height: 100%; }
#menu_responsive{ display:none;}
iframe{  border-width: 0;}

/* SITE */
/***********************************************/
#container_wrapper, #wrapper { position:relative; width:100%; min-height:100%; margin:0; padding:0; float:left; }
.copyright_mobile{ display: none;}
#section-banner, #section-banner-in, .bg_top, .top, .redes_sociais, .top_right { position: relative; width: 100%; margin: 0; padding: 0; float: left; }
#section-banner, #section-banner-in { overflow: hidden; z-index: 9; }
#section-destaques { position: relative; width: 100%;  padding: 0;  margin: 0; float: left; overflow: hidden; display: block;}
.conteudo, .section, #bg_container_forms { width: 94%; margin: 3%; padding: 0; float: left; overflow: hidden; display: block; position: relative;}

.logo { position: relative; width: 13%; margin: 0; padding: 1% 0; float: left; z-index: 999; }
.logo a { display: block; float: left; }
.logo img { position: relative; width: 100%; margin: 0; padding: 0; float: left; }
.bg_top { position: fixed; z-index: 100; overflow: hidden; background: rgba(255,255,255,0.95); -webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: 0 8px 6px -6px black; box-shadow: 0 8px 6px -6px black; }
.top { overflow: hidden; }
.top_right { width: 87%; margin-top: 2%; }
.top_right_mobile{ display: none;}
.redes_sociais ul { list-style: none; margin: 0; padding: 0; text-align: right; float: right; }
.redes_sociais ul li { position: relative; width: 28px; height: 28px; padding: 0; margin: 0; float: left; margin-left: 10px; background: #333333; }
.redes_sociais ul li.apoio_top{ width: auto; max-height: 28px; height: 100%; background: none; margin-right: 10px;}
.redes_sociais ul li.apoio_top img{ max-height: 28px; width: auto;}
.redes_sociais ul li:hover { transition: background-color 0.5s ease; background: #F16521; }
.redes_sociais ul li:hover { transition: background-color 0.5s ease; background: none; }
.redes_sociais ul li a { display: block; float: left; width: 14px; height: 14px; padding: 7px; margin: 0; }
.redes_sociais ul li.apoio_top a { display: block; float: left; width: auto; height: auto; padding: 0; margin: 0; }
.redes_sociais ul li a img { position: absolute; margin: 0; padding: 0; top: 7px; left: 7px; }
.next-step { position: absolute; width: 100%; margin: 0; padding: 0; bottom: 4%; left: 0; z-index: 2; text-align: center; }

/*GERAIS*/
.container_content, .section-destaques, .bg_footer, .conteudo-60 { position: relative; width: 100%; margin: 0; padding: 0; float: left; }
.background-size { width: 100%; height: 100%; overflow: hidden;  display: block; }
.zoom { -moz-transition: all .5s; -webkit-transition: all .5s; transition: all .5s; -moz-transform: scale(1,1); -webkit-transform: scale(1,1); transform: scale(1,1); }
.zoom:hover { -moz-transform: scale(1.2,1.2); -webkit-transform: scale(1.2,1.2); transform: scale(1.2,1.2); }
.title_section { position: relative; width: 100%; margin: 0 0 3%; padding: 0; font-size: 36px; line-height: 38px; text-transform: uppercase; color: #373737; text-align: center; font-weight: 500; text-align: center; }
.section_title, .page_title { position: relative; width: auto; margin: 0 auto; padding: 0; display: inline-block; text-align: center; }
.section_title span { display: inline-block; width: auto; margin: 0; padding: 0; }
a.botao { text-transform: uppercase; color: #323232; font-size: 13px; text-decoration: none; font-weight: 600;}
a.botao span { color:#F16521; }
.btn_more a { position: relative; width: 100%; margin: 0; padding: 0; text-align: center; text-decoration: none; display: inline-block; }
.btn_more a:hover { text-decoration: none; }


/*HOMEPAGE*/
ul.servicos_destaque, #testemunhos, .portfolios_destaque { position: relative; width: 110%; margin: 0 0 0 -10%; padding: 0; float: left; list-style: none; overflow: hidden; }
.servicos_destaque li, #testemunhos li, .portfolios_destaque li { width: 23.33%; margin: 0; padding: 0 0 3% 10%; float: left; overflow: hidden; cursor: pointer; }
.servicos_destaque li .img_item { position: relative; width: 24%; margin: 5% 28%; padding: 10%; float: left; list-style: none; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background: #000000; }
.servicos_destaque li .img_item img { width: 100%; }
.servicos_destaque li .titulo, .servicos_destaque li .descricao {  position: relative; width: 94%; margin: 0 auto 5%; padding: 5% 3%; text-align: center; font-size: 36px; line-height: 40px; color: #323232; font-weight: 400; border-bottom: 1px solid #F16D2D; }
.servicos_destaque li .descricao { color: #666666; }
.servicos_destaque li .descricao { padding: 0 3%; text-align: center; font-size: 16px; line-height: 20px; border-bottom: 0px solid #F16D2D; }
.link_more { position: relative; width: 100%; margin: 0; padding: 0; float: left; text-align: center; }
.link_more a { position: relative; text-align: center; font-size: 16px; line-height: 20px; text-decoration: none; display: inline-block; }
.link_more a:hover { text-decoration: none; }
.servicos_destaque li .img_item img { -moz-transition: all .5s; -webkit-transition: all .5s; transition: all .5s; -moz-transform: scale(1,1); -webkit-transform: scale(1,1); transform: scale(1,1);}
.servicos_destaque li:hover .img_item img { -moz-transform: scale(1.2,1.2); -webkit-transform: scale(1.2,1.2); transform: scale(1.2,1.2); }
.section-testemunhos { margin-top: 0; margin-bottom: 0; padding: 5% 0; background-image: url(../img/bg_testemunhos_top.png), url(../img/bg_testemunhos_bottom.png); background-position: center top, center bottom; background-repeat: no-repeat; }
.lista_testemunhos { position: relative; width: 100%; margin: 0; padding: 0; float: left; }
#testemunhos { width: 100%; margin: 0 0 2%; overflow: visible; }
#testemunhos li { width: 100%; margin: 0; cursor: default; padding: 0 0 3% 0% }
#testemunhos li .desc, #testemunhos li .name, #testemunhos li .other { position: relative; width: 90%; margin: 0 0 2%; padding: 0 5%; font-size: 20px; line-height: 26px; float: left; text-align: center; color: #AAAAAA; font-weight: 300; }
#testemunhos li .name, #testemunhos li .other { font-size: 20px; line-height: 22px; color: #333333; margin: 0 0 1%; font-weight: 400; }
#testemunhos li .other { font-size: 18px; line-height: 20px; color: #666666; font-weight: 400; }
#testemunhos li .name { text-transform: uppercase; }
.portfolios_destaque { position: relative; width: 100% !IMPORTANT; margin: 0 0 20px; overflow: visible; }
.portfolios_destaque li { position: relative; width: 100% !IMPORTANT; margin: 0; padding: 0; float: left; overflow: hidden; }
.portfolios_destaque li .destaque_portefolio { position: relative; width: calc(25% - 1px); margin: 0 0 1px 1px; padding: 0; float: left; overflow: hidden; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.portfolios_destaque li .destaque_portefolio .background-size { -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: scale(1.12); transform: scale(1.12); }
.portfolios_destaque li .destaque_portefolio:hover .background-size { opacity: 0.5; -webkit-transform: scale(1); transform: scale(1); }
.portfolios_destaque li .destaque_portefolio .caption { position: absolute; width: 100%; height: 100%; top: 0; left: 0; text-align: center; text-decoration: none; color: #FFFFFF; font-size: 26px; line-height: 30px; font-weight: 300; }
.portfolios_destaque li .destaque_portefolio:hover .caption { background: rgba(0,0,0,0.5); }
.portfolios_destaque li .destaque_portefolio .caption::before { position: absolute; top: 10px; right: 10px; bottom: 10px; left: 10px; -webkit-transform: scale(1.1); transform: scale(1.1); }
.portfolios_destaque li .destaque_portefolio .caption::before, 
.portfolios_destaque li .destaque_portefolio .caption p { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; }
.portfolios_destaque li .destaque_portefolio .caption p { margin: 0; position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%);}
.portfolios_destaque li .destaque_portefolio:hover .caption::before,
.portfolios_destaque li .destaque_portefolio:hover p { opacity: 1; }

/*LISTA PORTEFOLIOS*/
.portfolio-tab, .isotopeWrapper { position: relative; width: 100%; margin: 2% 0 4%; padding: 0; float: left; text-align: center; }
.portfolio-tab li, .isotopeWrapper li { position: relative; margin: 0; padding: 0; display: inline-block; list-style: none; }
.portfolio-tab li a, .portfolio-tab li span { position: relative; margin: 0; padding: 5px; float: left; color: #323232; white-space: nowrap; font-size: 20px; line-height: 20px; }
.portfolio-tab li a:hover, .portfolio-tab li a.current { color: #F16521; text-decoration: none; }
.isotopeWrapper { width: 103%; margin: 0 0 0 -3%; }
.isotopeWrapper li { width: 30.30%; margin: 0 0 3% 3%; padding: 0%; background: #F5F5F5; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; list-style: none; overflow: hidden; }
.isotopeWrapper li .view {	width: 100%; height: 100%; margin: 0px; padding: 0; float: left; overflow: hidden; position: relative; text-align: center; cursor: pointer; }
.isotopeWrapper li .view .mask, .isotopeWrapper li .view .content { width: 100%; height: 100%; position: absolute; overflow: hidden; top: 0; left: 0; }
.isotopeWrapper li .view .mask { opacity: 0; overflow:visible; border:0px solid rgba(0,0,0,0.7); -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; }
.isotopeWrapper li .view .img { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; margin: 0; padding: 0; }
.isotopeWrapper li .view .img .zoom { -moz-transition: all .5s; -webkit-transition: all .5s; transition: all .5s; -moz-transform: scale(1,1); -webkit-transform: scale(1,1); transform: scale(1,1); }
.isotopeWrapper li .view:hover .img .zoom { -moz-transform: scale(1.2,1.2); -webkit-transform: scale(1.2,1.2); transform: scale(1.2,1.2); }
.isotopeWrapper li .view a span.info { background: url(../img/link.png) center no-repeat; display: inline-block; text-decoration: none; padding: 0; width: 20px; height: 20px; background: url(../img/lupa.png) no-repeat center center; position:relative; top:-10px; opacity:0; -moz-transform:scale(0,0); -webkit-transform:scale(0,0); -o-transform:scale(0,0); -ms-transform:scale(0,0); transform:scale(0,0); -webkit-transition: -webkit-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out; -moz-transition: -moz-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out; -o-transition: -o-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out; -ms-transition: -ms-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out; transition: transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out; position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%); }
.isotopeWrapper li .view:hover .mask { opacity: 1;border-style: solid; background: rgba(0,0,0,0.7); }
.isotopeWrapper li .view:hover a span.info { opacity:1; -moz-transform:scale(1,1); -webkit-transform:scale(1,1); -o-transform:scale(1,1); -ms-transform:scale(1,1); transform:scale(1,1); -moz-transition-delay:0.3s; -webkit-transition-delay:0.3s; -o-transition-delay:0.3s; -ms-transition-delay:0.3s; transition-delay:0.3s; }
.isotopeWrapper li .view .titulo { color: #FFFFFF; position: absolute; font-size: 30px; line-height: 34px; bottom: 8%; right: 0; padding: 4%; max-width: 86%; text-shadow: 4px 4px 2px rgba(0, 0, 0, 1); text-transform: uppercase; font-weight: 300; }

/*CONTEUDOS*/
.conteudo-60 { width: 60%; margin: 0 20%; }
.titulo_sub_zona{ font-size: 22px; text-transform: uppercase; color: #323232; text-align: center;}

/*SERVIÇOS*/
ul.lista_servicos { position: relative; width: 110%; margin: 0 0 0 -10%; padding: 0; float: left; list-style: none; overflow: hidden; }
ul.lista_servicos li { width: 23.33%; margin: 0; padding: 0 0 3% 10%; float: left; overflow: hidden; cursor: pointer; }
ul.lista_servicos li a, .servicos_destaque li a { text-decoration: none;}
ul.lista_servicos li .img_item { position: relative; width: 24%; margin: 5% 28%; padding: 10%; float: left; list-style: none; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background: #000000; }
ul.lista_servicos li .img_item img { width: 100%; }
ul.lista_servicos li .titulo, .lista_servicos li .descricao {  position: relative; width: 94%; margin: 0 auto 5%; padding: 5% 3%; text-align: center; font-size: 36px; line-height: 40px; color: #323232; font-weight: 400; border-bottom: 1px solid #F16D2D; float: left;}
ul.lista_servicos li .descricao { color: #666666; padding: 0 3%; text-align: center; font-size: 16px; line-height: 20px; border-bottom: 0px solid #F16D2D; }
ul.lista_servicos li .img_item img { -moz-transition: all .5s; -webkit-transition: all .5s; transition: all .5s; -moz-transform: scale(1,1); -webkit-transform: scale(1,1); transform: scale(1,1);}
ul.lista_servicos li:hover .img_item img { -moz-transform: scale(1.2,1.2); -webkit-transform: scale(1.2,1.2); transform: scale(1.2,1.2); }
.service { position: relative; width: 54%; margin: 0 20%; padding: 3%; float: left; background: #FFFFFF; }
.service .img_item { position: relative; width: 54%; margin: 5% 18%; padding: 10%; float: left; list-style: none; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background: #000000; }
.service .img_item img { width: 100%; }
.service .left_service, .service .right_service { position: relative; width: 27%; margin: 0 6% 0 0; padding: 0; float: left; }
.service .right_service { width: 67%; margin: 0; }
.service .section_title, .page_title { width: 100%; text-align: left; }
a.link_servico_int{ text-decoration: none; display: block;}
.link_servico_int i{ min-width: 30px; text-align: center;}

/*LISTA TESTEMUNHOS*/
ul.lista_testemunhos { position: relative; width: 103%; margin: 0 0 0 -3%; padding: 0; float: left; list-style: none; overflow: hidden;}
ul.lista_testemunhos li { width: 28.33%; margin: 0 0 3% 3%; padding: 0 1% 3%; float: left; overflow: hidden;  cursor: pointer; border-bottom: 1px solid #CCC;}
li.testemunho .desc{ font-size: 14px; text-align: justify; }
li.testemunho .name { font-weight: 500; text-align: center;}
li.testemunho .other { font-weight: 500; text-align: center; font-size: 16px;}

/*FOOTER*/
.bg_footer { background: #313131; color: #FFFFFF; }
.footer, .top { position: relative; width: 94%; margin: 0 3%; padding: 0; float: left; overflow: hidden; display: block; font-size: 14px; font-weight: 300; }
.top-step { position: relative; width: 100%; height: 52px; margin: 1% 0; padding: 0; float: left; text-align: center; }
.apoios p{ width: 100%; float: left; margin:0px; padding: 0; text-align: center;}
.apoios p img{ max-height: 30px; width: auto!IMPORTANT; height: auto; max-width: 100%;  margin: 10px 0px 0px; height: auto!IMPORTANT;}
.apoios {  position: relative; width: 44%;  margin: 0;  padding: 0px;  float: left;}
.footer a{ text-decoration: none; color: #E5E6E7;}
.copyright { position: relative; width: 28%; margin: 0; padding: 0; float: left; }
.netsigma { position: relative; width: 28%; margin: 25px 0 0; padding: 0; float: right; text-align: right }
.netsigma a { display: inline-block; float: right; } 
.netsigma a span { float: left; padding: 0; margin: 0; line-height: 20px; }
.netsigma a img { float: left; padding: 0; margin: 0 0 0 5px; }

/*MAPA*/
.bg_mapa { position: relative; width: 100%; height: 640px; padding: 0; margin: 0; float: left; overflow: hidden; }
.mapa { position: relative; width: 100%; height: 100%; margin: 0; padding: 0%; float: left; overflow: hidden; z-index: 1; }
.mapa iframe {     position: absolute;
    top: 0px;
    left: 0;
    width: 100% !IMPORTANT;
    height: 100%;
 }
.scrolloff { pointer-events: none; }
.data-maps { display: none; }
.map_content { position: absolute; margin: 3%; padding: 1% 2%; right: 10%; overflow-x: hidden; z-index: 2; background: rgba(255,255,255,0.8); -moz-box-shadow: 3px 3px 4px 4px #31333D; -webkit-box-shadow: 3px 3px 4px 4px #31333D; box-shadow: 3px 3px 4px 4px #31333D; color: #373737; font-size: 24px; font-weight: 400; width: 360px; }
.map_content a { color: #FFF!IMPORTANT; font-weight: 500; }
.title_mapa { position: relative; width: 100%; margin: 0 0 5px; padding: 10px; float: left; webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; color: #373737; font-size: 36px; font-weight: 400; text-transform: uppercase; }
.bg_mapa a { height: 100%;  width: 100%;  float: left; overflow: hidden;}

/*LOADER*/
.content_loader, .update_progress { position: fixed; width: 100%; height: 100%; margin: 0; padding: 0; z-index: 1000; background: rgba(0,0,0,0.8); top: 0; left: 0; }
.content_loader {  }

a.linkFile[href$=".pdf"], a.linkFile[href$=".PDF"], a.linkFile[href$=".doc"], a.linkFile[href$=".DOC"], a.linkFile[href$=".DOCX"], a.linkFile[href$=".docx"], a.linkFile[href$=".xls"], a.linkFile[href$=".XLS"], a.linkFile[href$=".xlsx"], a.linkFile[href$=".XLSX"], a.linkFile[href$=".zip"], a.linkFile[href$=".ZIP"], a.linkFile[href$=".ppt"], a.linkFile[href$=".pptx"] { padding: 10px 0px 10px 34px; line-height: 26px; margin:-2px 0; background-repeat: no-repeat; background-position: left 10px; text-decoration: none; }

a.linkFile[href$=".pdf"] { background-image: url(/css/site/img/pdf.png); }
a.linkFile[href$=".PDF"] { background-image: url(/css/site/img/pdf.png); }
a.linkFile[href$=".doc"] { background-image: url(/css/site/img/doc.png); }
a.linkFile[href$=".docx"] { background-image: url(/css/site/img/doc.png); }
a.linkFile[href$=".DOC"] { background-image: url(/css/site/img/doc.png); }
a.linkFile[href$=".DOCX"] { background-image: url(/css/site/img/doc.png); }
a.linkFile[href$=".xls"] { background-image: url(/css/site/img/xls.png); }
a.linkFile[href$=".xlsx"] { background-image: url(/css/site/img/xls.png); }
a.linkFile[href$=".ppt"] { background-image: url(/css/site/img/ppt.png); }
a.linkFile[href$=".pptx"] { background-image: url(/css/site/img/ppt.png); }
a.linkFile[href$=".XLS"] { background-image: url(/css/site/img/xls.png); }
a.linkFile[href$=".XLSX"] { background-image: url(/css/site/img/xls.png); }
a.linkFile[href$=".jpg"] { background-image: url(/css/site/img/img.png); }
a.linkFile[href$=".jpeg"] { background-image: url(/css/site/img/img.png); }

/*COOKIES*/
.wgt-cookies { position: fixed; width: 94%; margin: 0; padding: 1% 3% 0; bottom: 0; left: 0; z-index: 10000; background: rgba(241,101,33,0.90); display: none; color: #FFFFFF; }
.msg_cookies, .opt_cookies { position: relative; width: 20%; margin: 0; padding: 0; float: left; } 
.msg_cookies { width: 80%; font-size: 12px; line-height: 14px; }
.opt_cookies a:first-child { color: position: relative; margin: 0; padding: 0 10px; font-size: 12px; clear: right; float: right; color: #FFFFFF; }
.opt_cookies a:last-child { position: relative; margin: 0 0 10px; padding: 4px 10px; color:#F4F4F4; border-color:#000000; background:#213A5B; clear: right; float: right; font-size: 12px; background: -moz-linear-gradient(top, #333333  40%, #111111); background: -webkit-linear-gradient(top, #333333  40%, #111111); filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333 ', endColorstr='#111111'); -moz-box-shadow: inset 0 1px 0 0 rgba(255,255,255,.4); -webkit-box-shadow: inset 0 1px 0 0 rgba(255,255,255,.4); box-shadow: inset 0 1px 0 0 rgba(255,255,255,.4); border: 1px solid #FFFFFF; }


.left { float: left !IMPORTANT; }
.right { float: right !IMPORTANT; }
.cleat_left { clear: left !IMPORTANT; }
.clear_right { clear: right !IMPORTANT; }
.esconde { display: none; }
.esconde_topo { padding-top: 0% !IMPORTANT; padding-bottom: 0% !IMPORTANT; height: 0% !IMPORTANT; }


/* ANIMAÇÕES PORTOFÓLIO */
/* Start: Recommended Isotope styles */
/**** Isotope Filtering ****/
.isotope-item { z-index: 2; }

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:         top, left, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

/* End: Recommended Isotope styles */



/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling {
  -webkit-transition: none;
     -moz-transition: none;
      -ms-transition: none;
       -o-transition: none;
          transition: none;
}

/* Icon Hang */
@-webkit-keyframes hvr-icon-hang {
  0% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }

  50% {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
  }

  100% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
}

@keyframes hvr-icon-hang {
  0% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }

  50% {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
  }

  100% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
}

@-webkit-keyframes hvr-icon-hang-sink {
  100% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
}

@keyframes hvr-icon-hang-sink {
  100% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
}

.hvr-icon-hang {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;  
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.hvr-icon-hang img {
  -webkit-animation-name: hvr-icon-hang-sink, hvr-icon-hang;
  animation-name: hvr-icon-hang-sink, hvr-icon-hang;
  -webkit-animation-duration: .3s, 1.5s;
  animation-duration: .3s, 1.5s;
  -webkit-animation-delay: 0s, .3s;
  animation-delay: 0s, .3s;
  -webkit-animation-timing-function: ease-out, ease-in-out;
  animation-timing-function: ease-out, ease-in-out;
  -webkit-animation-iteration-count: 1, infinite;
  animation-iteration-count: 1, infinite;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-direction: normal, alternate;
  animation-direction: normal, alternate;
}