body{
  min-width: 600px;
}

div{
	display: block;
}
h1, .h1, h2, .h2, h3, .h3 {
  margin-top: 20px;
  margin-bottom: 10px;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: inherit;
}
h3 {
  display: block;
  font-size: 1.17em;
  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  font-weight: bold;
}
 ul {
    list-style: none;
}
body{
  background: url(http://emgo.com.br/imagens/Emgo_fundo_azul.webp);
}
@font-face {
  font-family: 'Myriad';
  src: url('http://emgo.com.br/fonts/teste.otf') format('truetype');
}
@font-face {
  font-family: 'BankGothic';
  src: url('http://emgo.com.br/fonts/bgothm.ttf') format('truetype');
}

@keyframes rotateZap{

  0%{ rotate: 0deg;}
  1%{ rotate: 20deg;}
  2%{ rotate: 0deg;}
  3%{ rotate: -20deg;}
  4%{ rotate: 0deg;}
  5%{ rotate: 20deg;}
  6%{ rotate: 0deg;}
  7%{ rotate: -20deg;}
  8%{ rotate: 0deg;}
  100%{ rotate: 0deg;}
}
@keyframes borderZap{

  0%{ scale: 1; opacity: 1;}
  8%{ scale: 2; opacity: 0;}
  100%{ scale: 1; opacity: 0;}
}

#div_zap {
    width: 80;
    position: fixed;
    z-index: 10;
    right: 70px;
    bottom: 70px;
    cursor: pointer;

    animation-name: rotateZap;
    animation-duration: 6s;
    animation-timing-function: ease;
    animation-iteration-count: infinite;
    display: flex;
    align-items: center;
    justify-content: center;
}
.img-zap {
    width: 100%;
    z-index: 7;
}
#div_border {
    width: 80%;
    height: 64px;
    position: fixed;
    border: 2px solid green;
    border-radius: 50%;
    z-index: 5;

    animation-name: borderZap;
    animation-duration: 6s;
    animation-timing-function: ease;
    animation-iteration-count: infinite;
}
#div_img {
    margin: auto;
    width: auto;
    justify-content: center;
    display: flex;
    position: relative;
    padding: 0px;
}
#div_top {
    background: white;
    width: 100%;
    padding: 0;
    border-radius: 5px;
    transition: 2s;
}
#div_avaliacoes {
    width: 89%;
    height: 550px;
    margin: auto;
    margin-top: 50;
    border-top: 2px solid black;
    padding-top: 15;
}
#img_emgo_titulo, #img_emgo_titulo_mobile {
    width: 100%;
}
#img_emgo_titulo_mobile {
    display: none;
}
#div_button {
    position: absolute;
    right: 15;
    top: 15;
    border: 3px solid #000038;
    border-radius: 6px;
}
.p-cite {
    position: absolute;
    width: 350;
    font-family: 'BankGothic';
    font-weight: bold;
    font-size: 16px;
    text-align: center;
    right: 3%;
    top: 200;
}
/*------------- frase de efeito -----------*/
.div-frase {
    background-color: #000038;
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.p-frase {
    color: white;
    font-family: BankGothic;
    font-size: 24px;
    text-align: center;
}
/*------------ contagem ----------------*/
#div_contagem {
    margin-top: 35px;
}
#p_contagem_alt {
    font-family: BankGothic;
    color: rgb(255,111,15);
    text-align: center;
    font-size: 140px;
    text-shadow: 2px 1px black;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 115px;
}
.p-contagem, .p-contagem2, .p-contagem3 {
    margin: 0;
    text-align: center;
    font-family: 'Myriad';
    color: black;
    font-size: 27px;
    font-weight: bold;
    letter-spacing: 8px;
}
.p-contagem2 {
    letter-spacing: 6px;
}
.p-contagem3 {
    margin-top: 25px;
    letter-spacing: 4px;
}
.div-explanation {
    width: 75%;
    max-width: 750px;
    margin: auto;
    margin-top: 15px;
    text-align: center;
    font-family: 'Myriad';
    font-size: 14px;
}
/*------------------------- servicos ---------------------*/
.div-servicos {
    margin-top: 55px;
}
.p-servico {
    text-align: center;
    font-family: 'Myriad';
    font-size: 21px;
    font-weight: bold;
    border-bottom: 3px solid rgb(230 143 32);
    width: 80%;
    margin: auto;
}
.div-fotos {
    width: 90%;
    margin: auto;
    margin-top: 25;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.div-fotos img{
  padding: 10px;
  max-height: 80vh;
  transform: scale(0);
  transition: 0.8s;
  max-width: 100%;
}
.img-fotos {
    padding: 10px;
    max-height: 80vh;
    transform: scale(1);
}
.div-fotos img.animate{
  transform: scale(1);
}
/*--------------load-----------------*/
.div-load {
    width: 80%;
    margin: auto;
    margin-top: 45px;
    transition: 1s;
}
#div_carregar{
  display: flex;
  justify-content: center;
  transition: 0.8s;
  opacity: 0;
}
.button-carregar {
    border: none;
    background-color: #000038;
    width: 180px;
    height: 50;
    color: white;
    font-family: 'Myriad';
    letter-spacing: 4px;
    border-radius: 5px;
}
.p-final {
    font-family: 'Myriad';
    text-align: center;
    width: 50%;
    margin: auto;
    margin-top: 47px;
    font-size: 21px;
    background-color: #000038;
    border-radius: 5px;
    color: white;
    padding: 7px;
    opacity: 0;
    transition: 0.8s;
}
/*--------------rodapé--------------*/
#div_rodape {
    background-color: #000038;
    text-align: center;
    padding: 25 15 10 15;
    color: white;
    font-family: 'Myriad';
}
@media(max-width: 1190px){
  .p-cite {
    width: 280px;
  }
}
@media(max-width: 980px){
  #img_emgo_titulo_mobile{
    display: block;
  }
  #img_emgo_titulo{
    display: none;
  }
  .p-cite {
    width: 300px;
    font-size: 21px;
    top: 800;
  }
  .p-explanation {
    font-size: 18px;
  }
}
@media(max-width: 800px){
  .p-frase {
    font-size: 3vw;
    }
  .p-cite {
    top: 50%;
    width: 35vw;
     font-size: 3vw;
  }
}