/*************************/

#fot{
  margin-top: 100%;
  bottom:0;
}

.spinner{
    width: 50px;
    height: 50px;
    position: fixed;
    left:48%;
    top:50%;
    transform: translate(-50%,-50%);
    border-radius: 100%;
    border: 2px solid white;
    border-top:4px solid black;
    animation: spin 2s linear infinite;
    z-index:9999;

  }
  @keyframes spin{
  from{
  transform: rotate(0deg);

  }to{
  transform: rotate(360deg);
  }
  }
  .cover{
    position: fixed;
    z-index:999999999 !important;
    top:0;
    left:0;
    margin:auto;
    background-color:rgb(255,205,4);
    width:100%;
    height:100%;
    z-index:9999;
  }
  .image{
    width:400px;
    position: absolute;
    left:50%;
    top:40%;
    z-index:9999;
    transform:translate(-50%,-50%);

  }
  .cover img{
  position:absolute;
  }
/***********************/
.content{
  min-height: 55.5vh;
  width: 70%;
  margin: auto;
  text-align: center;
  padding-top: 7vh;
  max-height: none;
}
ol{
  list-style-type: none;
  display: inline-block;
  text-align: left;
  padding: 0 30px;
  transform: translateY(-12vh);
}
ol li a{
  text-decoration: none;
  color: rgb(50,50,50);

}
ol li a:hover {
  text-decoration: underline !important;
}
ol li:last-child{
  margin-top: 20px;
}
#map{
  display:inline-block;
  width: 50%;
  height: 33vh;
}
#button{
   border: 1px solid Red;
   width:220px;
   text-align: center;
   padding:20px 50px;
   border-radius:5px;
   transition: 0.6s;
   color: red;
   cursor:pointer;
 }
 #button:hover{
   border-radius: 30px;
   color: white;
   background: red;

 }
 #modal{
  width:80%;
  height:80%;
  margin: auto;
  margin-top:3%;
  padding-bottom:20px;
  background: rgb(245,245,245);
  border-radius:20px;
   z-index:999999999 !important;
}
#hider{
  width:100%;
  height:100%;
  display: none;
  background: rgb(50,50,50,0.8);
  top:0;
  position:fixed;
  z-index:999999999 !important;
  left:0;
}

#Nome{
  width:80%;
  height:10%;
  border: 2px solid black;
  font-size:30px;
  margin-left:9%;
  margin-top:20px;
}
#EmailUs{
  width:80%;
  height:10%;
  border: 2px solid black;
  font-size:30px;
  margin-left:9%;
  margin-top:20px;
}
#phone{
  width:80%;
  height:10%;
  border: 2px solid black;
  font-size:30px;
  margin-left:9%;
  margin-top:20px;
}
#question{
  width:80%;
  height:40%;
  padding-bottom:10%;
  border: 2px solid black;
  font-size:30px;
  margin-left:9%;
  margin-top:20px;
  resize: none;
}
#copy{
  width:9%;
  height:46px;
  margin-bottom:10px;
  border: 2px solid black;
  font-size:20px;
  margin-left:1%;
  background: rgb(255,60,60);
  cursor:pointer;
  color:white;
}
#Enviar{
  width:200px;
  border:1px solid black;
  background: gray;
  border-radius:5px;
  height:40px;
  margin-left:50%;
  margin-top:2%;
  transform: translateX(-100px);
  color:white;
}

#Enviar:not(:hover){
  border-radius:5px;
  border: 1px solid black;
  background:gray;

}


#exit{
  text-align: center;
  padding:10px;
  font-size:40px;
  background: rgb(240,70,70);
  display: block;
  width:60px;
  color: white;
  border-top-right-radius: 20px;
  margin-left:100%;
  transform: translateX(-60px);
  cursor: pointer;
}
#exit:hover{
  background:rgb(240,170,170);
}
 @media (max-width: 1000px) {
   .content{
     width: 90%;
     min-height: 60vh;
   }
   #map{
     display:inline-block;
     width: 60%;
     height: 33vh;
   }
 }
 @media (max-width: 815px) {
   .content{
     width: 100%;
   }
   ol{
     transform: translateY(-0vh);
     padding: 20px
   }
   #map{
     display:inline-block;
     width: 100%;
     height: 33vh;
   }
 }
 .op:nth-child(5){
 	background: white;
 	color: black !important;
 }
 .op:nth-child(5):hover{
 	background: white;
 	color: black !important;
 }