/* Theme Name: TEC Unimar
Theme URI: https://tec.unimar.br
Author: Mustache
Author URI: https://mustache.com.br
Description: Tema desenvolvido para o setor TEC Unimar, a cópia parcial ou total é proibida.
*/

html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul, dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object, a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span, strong, sub, sup, tt, var, legend, fieldset, figure {margin: 0; padding: 0;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block; } img {max-width: 100%; height: auto; } @media screen {img { width: auto;} } 
:root{--azul1: #003264; --azul2: #0072BC; --azul3: #4093db; --cinza1:#53595f; --cinza2: #9e9e9e; --cinza3: #eaeaea;} 
*{font-family: 'Montserrat', sans-serif;}

/*Formatação Básica*/
body {color: #333; background: #fff; }
a, a:hover {color: unset; text-decoration: none!important; outline: none;}
b, strong{font-weight: 700;} 
p{margin: 10px 0; padding: 0;} 
button:focus {outline: none;} 
html{scroll-behavior: smooth;}
section{scroll-margin-top: 70px;}
.cc-color-override-1444386161 .cc-btn{background: #0072BC!important; transition: .3s}
.cc-color-override-1444386161 .cc-btn:hover{background: #003264!important;}

/***************************FHD************************/
#menu {
  width: 100%;
  padding: 20px 0;
  position: sticky;
  top: 0;
  right: 0;
  left: 0;
  z-index: 10500;
  background: var(--azul2);

  .content {
    width: 80%;
    margin: 0 auto;
  }

  .navbar{
    padding: 0;
  }

  .navbar-brand {
    background: #fff;
    padding: 7px 20px 7px 10px;
    border-radius: 40px;
    img {
      height: 60px;
      width: auto;
      margin-bottom: 0;
    }
  }

  .navbar-expand-xl {
    .navbar-nav {
      margin: 0 0 0 auto;
       gap: 20px;
      .dropdown-menu {
        position: absolute;
        background: #fff;
        font-size: 90%;
        margin: 0 -10px;
        &:before {
          content: '';
          top: -16px;
          position: absolute;
          left: 10%;
          width: 0;
          height: 0;
          border-right: 8px solid transparent;
          border-top: 8px solid transparent;
          border-left: 8px solid transparent;
          border-bottom: 8px solid #ffffff;
        }
      }
    }
  }

  .navbar-nav {
    .nav-item {
      margin: 0px;
    }

    li:hover {
      .dropdown-menu {
        display: block;
      }
    }

    .nav-link {
      color: rgb(255, 255, 255);
      font-size: 1rem;
      padding: 0;
      transition: 0.3s;
      &:hover {
        color: #00d9ff;
      }
    }
  }

  .dropdown-menu {
    li a {
      padding: 5px 15px;
      font-weight: 300;
    }
  }

  .dropdown-item:hover {
    display: block;
    width: 100%;
    padding: 0.25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: var(--azul2);
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
  }

  .dropdown-toggle::after {
    font-weight: 900;
    font-family: "Font Awesome 6 Free";
    content: "\f078";
    color: #00d9ff;
    display: inline-block;
    font-size: 11px;
    width: 15px;
    height: 15px;
    margin-left: 0.355em;
    vertical-align: 0.055em;
    border-top: 0 solid;
    border-right: 0 solid transparent;
    border-bottom: 0;
    border-left: 0 solid transparent;
  }
}

.pagina{
    .topo{
        background: rgb(0,91,170); 
        background: linear-gradient(180deg, rgba(0,91,170,1) 0%, rgba(64,147,219,1) 100%); 
        padding: 120px 10%; 
        h1{
            font-weight: 600; 
            margin: 0; 
            font-size: 3rem;
            color: #fff;
            line-height: 1.1;
        }
    }
    .conteudo{
      padding: 60px 10%;
    }
    p{
      font-size: 1.2rem;
      line-height: 1.5;
      margin: 10px 0;
    }
    strong, a, a:hover{
      color: var(--azul2);
    }
    h1, h2, h3, h4, h5, h6{
      color: var(--azul2);
      margin: 15px 0 10px;
      font-weight: 600;
    }
    & ul{
      list-style-type: disc;
      list-style-position: inside;
      li{
        &::marker{
          color: var(--azul2);
        }
      }
    }
    & .wp-block-file .wp-block-file__button {
      background: var(--azul1);
      border-radius: 30px;
      color: #fff;
      font-size: .9rem; 
      padding: 10px 30px; 
      transition: .3s; 
      opacity: 1;
      &:hover{
        background: var(--azul1);
      }
    }
    & .table{
      margin: 20px 0;
      thead th {
        vertical-align: 
        middle; color: var(--cinza1); 
        text-transform: uppercase; 
        font-weight: 600; 
        font-size: .8rem; 
        line-height: 1.2;
      }
      th, td{
        padding: 0.75rem 0.75rem 0.75rem 0; 
        text-align: left;
      }
    }
}

/*Nao encontrada*/
.notfound {padding: 150px 0px!important;  }
.notfound .pagewidth{width:70%;}
.notfound h2{font-size: 190%;}
.notfound p{width: 85%; line-height: 180%; font-size: 110%;}
.notfound ul li:before{display: none!important}
.notfound ul li{list-style-position: inside!important; list-style-image: url(images/list.png)!important; color: var(--cinza1)}
.msgnf{text-align: center; font-weight: 400;  margin-bottom: 20%;} 

/*Rodape*/
.footer {
  padding: 70px 0;
  background: var(--azul1); 
  width: 100%;
  color: #fff;
  & .content {
      width: 80%; 
      margin: 0 auto; 

  } 
  & .rodapemenu{
      padding: 10px;
      & h4{
          font-size: 1.2rem; 
          font-weight: 700; 
          text-transform: uppercase; 
          margin-bottom: 5px;
          &::after {
              content: ""; 
              background:  var(--azul3); 
              display: block; 
              margin: 10px 0px 10px 0px; 
              width: 25px;
              height: 3px;
              border-radius: 5px;
          } 
      }
      & ul{
          list-style: none;
          & li{
              padding: 5px 0;
              font-size: .9rem;
              & a{
                  color: #fff;
                  transition: .3s;
                  &:hover{
                      color:  var(--azul3);
                  }
              }
          }
      }
  }
  & .menusocial{
      margin-top: 20px;
      img{
          width: 280px; 
          display: block;
          margin:  0 0 20px -20px;
      } 
      address{
          text-align: left; 
          color: #fff; 
          font-size: 1rem; 
          margin: 0;
      }
      .contatos{
          padding: 15px 0;
          .contato{
              margin: 10px 0;
              font-size: 1rem;
              line-height: 1.5;
                  i{
                      color:  var(--azul3); 
                      margin-right: 5px;
                  }
          }
          a{
              color: #fff;
          }

      }
      .redes{
          display: flex;
          gap: 10px;
          .item{
              width: 40px;
              height: 40px;
              border-radius: 50%;
              display: flex;
              justify-content: center;
              align-items: center;
              background: #fff;
              color: var(--azul1);
              transition: .3s;
              font-size: 17px;
              &:hover{
                  background: var(--azul3);
                  color: #fff;
              }
          }
      }
  } 
  & .copyr{
    width: 100%; 
    margin: 40px 0 0; 
    & .rights{ 
      color: #fff; 
      padding: 0; 
      font-size: .9rem; 
      text-align: center;
    } 
    & .dev{
      float: right; 
      text-align: right; 
      color: #fff; 
      padding: 0; 
      font-size: .8rem; 
      font-weight: 300;
        img{
        width: auto; 
        height: .9rem; 
        margin-top: -2px;
      } 
    } 
  } 
}

/***************************HD************************/
@media (max-width: 1600px){
  #menu{
      & .content {
          width: 100%;
          padding: 0 60px;
      }
      & .navbar-brand {
          img {
              height: 50px;
          }
      }
  }
  .footer {
    & .content {
      width: 100%;
      margin: 0 auto;
      padding: 0 60px;
    }
  }
  .pagina{
    .topo{
      padding: 100px 5%; 
    }
  .conteudo {
        padding: 60px 5%;
    }    
  }
}

/***************************LG************************/
@media (max-width: 1024px) {
  #menu {
    & .navbar {
      padding: 0;
      & .navbar-toggler {
        padding: 0; 
        font-size: 2rem; 
        line-height: 1;
        & .navbar-toggler-icon {
          width: auto; 
          height: auto; 
          color: white;
        }
        &:focus{
          outline: 0;
        }
      }
      & .navbar-collapse {
        min-height: auto; 
        padding-top: 30px;
        & .dropdown-item {
          padding: 5px 10px; 
        }
      }
      & .navbar-brand{
        margin: 0px;
      }
    }
    & .navbar-expand-xl .navbar-nav .dropdown-menu{
      position: unset; 
      background: #fff; 
      width: 100%; 
      margin: 3px 0px; 
      &::before{
        display: none;
      }
    }
  }
  .footer {
    & .menusocial {
      text-align: center;
        img {
            width: 280px;
            display: block;
            margin: 0 auto 20px;
        }
        address{
          text-align: center;
          br{
            display: none;
          }
          .contatos {
            padding: 0;
            display: flex;
            flex-wrap: wrap;
            gap: 15px;
            justify-content: center;
            flex-direction: row;
          }
        }
        .redes {
          display: flex;
          gap: 10px;
          justify-content: center;
          margin: 5px auto 50px;
        }
    }
  }
  .pagina{
    .topo{
      padding: 100px 60px; 
    }
  .conteudo {
      padding: 60px;
    }    
  }
}

/***************************MEDIUM************************/
@media (max-width: 768px) {
  .footer {
      & .copyr {
        img.dados {
          display: block;
          margin: 0 auto 25px;
        }
        & .dev {
            float: unset;
            text-align: center;
            margin-top: 15px;
        }
      }
  }
}
/***************************MOBILE************************/
@media screen and (max-width: 480px) {
  #menu {
    padding: 15px 0;
    & .content {
        width: 100%;
        padding: 0 20px;
    }
    & .navbar-brand {
        img {
            height: 40px;
        }
    }
  }
  .footer {
      padding: 30px 0;
      & .content {
        padding: 0 30px;      
      }
      & .menusocial {
        img {
            width: 200px;
            display: block;
            margin: 0 auto 10px;
        }
        & address {
          .contatos {
            gap: 0;
            margin: 15px 0;
            .contato {
              margin: 10px 0;
              font-size: .9rem;
              line-height: 1;
            }
          }
        }
        .redes {
          margin: 15px auto 30px;
        }
      }
      & .rodapemenu {
          padding: 10px 0;
          text-align: center;
          & h4 {
            &::after {
              margin: 10px auto;
            }
          }
      }
      & .copyr {
          margin: 10px 0 0;
      }
  }
  .pagina{
    .topo{
      padding: 60px 30px; 
      & h1{
        font-size: 1.8rem;
      }
    }
  .conteudo {
      padding: 30px;
      p{
        font-size: 1rem;
      }
    }    
  }
}