/* Pagina Principal */

#wrapper #main {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  overflow: auto;
  background: rgba(54, 83, 171, 1);
  background: -moz-linear-gradient(180deg, rgba(54, 83, 171, 1) 75%, rgba(34, 53, 107, 1) 100%);
  background: -webkit-linear-gradient(180deg, rgba(54, 83, 171, 1) 75%, rgba(34, 53, 107, 1) 100%);
  background: linear-gradient(180deg, rgba(54, 83, 171, 1) 75%, rgba(34, 53, 107, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3653AB", endColorstr="#22356b", GradientType=1);
}

#wrapper #main:before {
  content: none;
}

#wrapper #main #header {
  position: relative;
  top: 0;
  width: 90%;
}

#wrapper #main #header img {
  width: 150px;
  margin: 30px;
}

#wrapper #main #header p {
  opacity: 1;
}

#wrapper #main #header nav a:hover,
#wrapper #main #header nav a:active,
#wrapper #main #header nav a:focus {
  text-decoration: none;
}

#wrapper #main #footer {
  position: relative;
  bottom: 0;
  font-size: 0.8rem;
  width: 90%;
  padding: 10px 10vw;
}

#wrapper #main #footer nav {
  font-size: 1em;
}

#wrapper #main #footer nav li {
  display: inline-block;
}

#wrapper #main #footer nav a:hover,
#wrapper #main #footer nav a:active,
#wrapper #main #footer nav a:focus {
  text-decoration: none;
  color: #131d3a;
}

#wrapper #main #footer nav li {
  font-size: 1.5rem;
  margin: 0px 5px;
  min-width: 45px;
  min-height: 45px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#wrapper #main #footer nav a.ama-logo {
  width: 130px;
  height: 22px;
  background: url('./images/ama.svg');
  background-repeat: no-repeat;
  background-size: 100%;
  margin-top: 14px;
}

#wrapper #main #footer nav a.ama-logo:hover,
#wrapper #main #footer nav a.ama-logo:active,
#wrapper #main #footer nav a.ama-logo:focus {
  background: url('./images/ama_blue.svg');
  background-repeat: no-repeat;
  background-size: 100%;
  margin-top: 14px;
}

#wrapper #main #header nav a.huawei-logo {
  background: url('./images/huawei.svg');
  background-repeat: no-repeat;
  background-size: 50%;
  background-position: 50% 50%;
}

#wrapper #main #header nav a.google-play-logo {
  background: url('./images/google-play.svg');
  background-repeat: no-repeat;
  background-size: 40%;
  background-position: 55% 50%;
}

#wrapper #main #header nav a.huawei-logo:before,
#wrapper #main #header nav a.google-play-logo:before {
  content: "";
}

#wrapper #main #footer #copywrite {
  color: white;
  margin-bottom: 10px;
}

#wrapper #main #footer #currentYear {
  vertical-align: baseline;
}

#wrapper #main #footer .icon.fa-blind {
  margin-top: -2px;
}

/* Pagina Acessibilidade */

#wrapper #main #header.alt-header {
  box-shadow: 0 3px 6px 0px rgba(0, 0, 0, 0.3);
  width: 100%;
  padding: 0 10vw;
}

#wrapper #main #header.alt-header .logo-container {
  width: 80%;
  text-align: center;
}

#wrapper #main #header.alt-header img {
  width: 70px;
}

#wrapper #main #header.alt-header #logo-title {
  font-weight: bold;
  font-size: 1.5em;
}

#wrapper #main #header.alt-header nav {
  margin: 0px;
}

#wrapper #main #header.alt-header nav li {
  line-height: unset;
  width: 4.35em;
}

#wrapper #main #header.alt-header .navbar-container {
  height: 85px;
}

#wrapper #main #header.alt-header nav a:before {
  font-size: 1.5em;
}

#wrapper #main #header.alt-header nav a:hover,
#wrapper #main #header.alt-header nav a:active,
#wrapper #main #header.alt-header nav a:focus {
  font-size: 1em;
}


#wrapper #main .content-container {
  padding: 40px 10%;
  width: 100%;
  min-width: 300px;
  text-align: justify;
  font-size: 1em;
  line-height: 1.5 !important;
  background-color: #F1F1F2;
  color: #2A2A2A;
}

#wrapper #main .content-container h1 {
  color: #2a4084;
  border-left: 3px solid #c7c7c7;
  padding-left: 15px;
  margin-bottom: 25px;
  margin-top: 10px;
  font-weight: bold;
  font-size: 1.875rem;
  line-height: 50px;
  text-align: left;
}

#wrapper #main .content-container h2 {
  color: #2a4084;
  margin-bottom: 25px;
  margin-top: 10px;
  font-weight: bold;
  font-size: 1.5rem;
  line-height: 45px;
  text-align: left;
}

#wrapper #main .content-container p {
  font-size: 1em;
  margin-bottom: 20px;
  margin-top: 10px;
}

#wrapper #main .content-container span {
  font-size: 1em;
}

#wrapper #main .content-container strong {
  font-size: 1.2em;
  font-weight: bold;
  color: #2a4084;
}

#wrapper #main .content-container a {
  text-decoration: underline;
  color: #3653AB;
  font-weight: 600;
}

#wrapper #main .content-container a:hover,
#wrapper #main .content-container a:active,
#wrapper #main .content-container a:focus {
  color: #131d3a !important;
  font-weight: bold;
}

#wrapper #main .content-container a:visited {
  color: #6b256b;
}

#wrapper #main a.no-link {
  color: inherit;
  text-decoration: none;
}

#wrapper #main a.no-link:focus {
  border: 1px solid white;
}

#wrapper #main #header a,
#wrapper #main #footer a,
#wrapper #main #header li,
#wrapper #main #footer li {
  vertical-align: middle;
  min-width: 45px;
  min-height: 45px;
}

.selo-acessibilidade img {
  width: 80%;
  max-width: 400px;
}

/*--------------------*/
/*     SKIP LINK      */
/*--------------------*/

.skip-link {
  /* Remove item from normal flow */
  position: absolute;
  top: 8px;
  left: 8px;
  color: black;
  font-size: 1.5rem;
  background-color: white;
  z-index: 2;
  padding: 10px 20px;
}

.skip-link:not(:focus) {
  /* Workaround for falsely pronounced, smushed text */
  white-space: nowrap;
  /* Set it to the smallest possible size (some screen readers ignore elements with zero height and width) */
  width: 1px;
  height: 1px;
  /* Hide overflowing content after resizing */
  overflow: hidden;
  /* Reset any property that may change the elements size */
  border: 0;
  padding: 0;
  /* Clipping defines what part of an element should be displayed. */
  /* Deprecated clip property for older browsers */
  clip: rect(0 0 0 0);
  /* clip-path for newer browsers. inset(50%) defines an inset rectangle that makes the content disappear. */
  clip-path: inset(50%);
  /* It seems like at the moment nobody is quite sure why margin: -1px is there.
      On top of that it seems to cause issues (see: https://github.com/h5bp/html5-boilerplate/issues/1985). */
  margin: -1px;
}

/*----------------*/
/*     UTILS      */
/*----------------*/

.mb-10 {
  margin-bottom: 10px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-40 {
  margin-bottom: 40px;
}

.clickable {
  cursor: pointer;
}