@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400&display=swap');
body {
    color:#333;
    font-family:  'Roboto',Arial ,Tahoma, Verdana,'Trebuchet MS'  ;
    font-size: 18px;
    letter-spacing:-1px;
    line-height: 23px;
    margin: 0 auto;
    min-width: 360px;
  
    
}
  
  section, article, div, nav, footer, aside, header {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  
  .row {
    min-height: 30px;
     /*width: 100%;
     max-width: 1240px;*/
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     align-content: flex-start;
     justify-content: center;
   
   }
   .linha{
    border: #ccc 0px solid;
    width: 1000px;
    min-height: 20px;
    padding: 0px 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
    /* text-align: center; */
  
   }
   .linha7{
    border: #ccc 0px solid;
    width: 768px;
    min-height: 30px;
    padding: 0px 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
    /* text-align: center; */
  
   }
   .item768{ width:768px;border: #069 0px solid;}
   .item31{ width:28%;border: #093 0px solid; max-width:300px;}
   .item35{ width:28%;border: #333 0px solid; max-width:300px;}
   .item50{ width:48%;border: #900 0px solid; }
   .item62{ width:64%;border: #909 0px solid;margin-right: 30px;max-width: 620px; }
   .item67{ width:64%;border: #069 0px solid;margin-right: 30px;max-width: 620px; }
   .item99{
   
      width:100%;
      min-height: 30px;
      border:0px solid #069;
     
      padding:5px 0px;
    
   }
   .fundo-azul{background-color:#0072b8;color:#fff;}
   .fundo-f2{background-color:#f2f2f2;color:#111;}
   .margint20{ margin-top:20px;}
   .c-azul{ color:#0072b8;}
   .titulo {color:#111;padding:0px 0px 0px 0px; font-family: 'Roboto',Arial, Helvetica, Tahoma;font-size:34px;margin:0 auto;line-height: 39px;}
   .subtitulo {color:#555;padding:0px 0px 0px 0px; font-family: 'Roboto',Arial, Helvetica, Tahoma;font-size:20px;font-weight: normal;}
   #mobi img { 
    width: 100%; 
     /*height:350px;*/
    -webkit-background-size: cover;
       -moz-background-size: cover;
       -o-background-size: cover;
       background-size: cover;
       border-radius: 0px;
       margin: 0 auto;
       
       
       }

       .myButton {
        background-color:#fd5304;
        -webkit-border-radius:25px;
        -moz-border-radius:25px;
        border-radius:25px;
        display:inline-block;
        cursor:pointer;
        color:#ffffff;
      
        font-size:20px;
        padding:10px 21px;
        text-decoration:none;
      }
      .myButton:hover {
        background-color:#bc3315;
      }
      .myButton:active {
        position:relative;
        top:1px;
      }
      a.link1:link, a.link1:visited, a.link1:active {
        color:#069;
        text-decoration:none;
        letter-spacing:-1px;  
               
      }
      
      a.link1:hover {
        color:#000;
        text-decoration:none;
      }

      .linhaf{width:100%;min-height:20px;border: 0px solid #333;margin:0px 0px; text-align: left;}
      .linhaf label {color:#333;font-size:15px;}
      input[type=text]{
        width:100%;
        padding:  5px;
        margin: 5px 0;
        border: 1px solid #999;
        border-radius: 4px;
        box-sizing: border-box;
        
        font-size: 0.9em;
        letter-spacing: -1px;
        
      }
      input[type=text]:focus, input[type=password]:focus, input[type=text]:hover, textarea:hover {
          border:1px solid #fc9906;
          border-radius: 4px;
          box-sizing: border-box;
          background-color: #f1f1f1;
      }
      input[type=button], input[type=submit], input[type=reset] {
        
        border: none;
         padding: 7px 10px ;
        text-decoration: none;
       /* font-family: 'metropolisregular','metropolisthin','metropolisbold', Arial, sans-serif;*/
        font-size: 0.7em;
        letter-spacing: -1px;
    
       
        cursor: pointer;
        border-radius: 4px;
          box-sizing: border-box;
          background-color: #069;
      }
      input[type=submit]:hover {
          background-color: #fc9906;
          color:#333;
      }
      textarea{
        font-family: 'metropolisregular','metropolisthin','metropolisbold', Arial, sans-serif;
        font-size: 0.9em;
        letter-spacing: -1px;
      }
      .inf {
        width:100%;
        padding: 7px;
        margin: 8px 0;
        border: 1px solid #999;
        border-radius: 4px;
        box-sizing: border-box;
        min-height: 60px;
      }

      a.link2:link, a.link2:visited, a.link2:active {
        color:#069;
        font-weight: bold;
        text-decoration:none;
        letter-spacing:-1px;           
            }
    
      a.link2:hover {
        color:#f30;
        text-decoration:none;
      }
      .error{
        background-color: #900;
        color:#fff;
        
        padding: 10px;
      }
        .sucess{
          background-color: #015a0d;
          color:#fff;
        
          padding: 10px;
        }
      .call{
        width:300px;  
        
        padding: 0;
        position:fixed;
        top:60px;
       
        background-color:#eee;
        border:0px solid #d2d2d2;
        padding:10px;
       }
       .flutua{
        width:280px;
        padding: 0;
        position:fixed;
        top:20px;
      
        background-color:#eee;
        border:0px solid #f60;
        padding:7px;
       }

       .topicos{
        display:flex;margin-bottom:10px;border-bottom:0px solid #ccc;
       }
       .iconev{
        font-size:20px;color:#069;
        margin:0px 10px 10px 0px;
        border:0px solid #900;
        min-height: 45px;
        width:20px;
       }
       .txt-topicos{
         border:0px solid #093;
         
       }
       
       

       @media screen and (max-width: 768px) { 
        /* #logo{width: 100px; position: fixed; z-index: 1000; left:5px;top:5px;}  
       #logo img { max-height:60px; }*/
        
       .row {
        min-height: 40px;
         /*width: 100%;
         max-width: 1240px;*/
         display: flex;
         flex-direction: row;
         flex-wrap: wrap;
         align-content: center;
         justify-content: center;
        
       
       }
        header p{
         text-align: center;
       }
       .linha, .linha7, .conteudo , .voltar {
           width: 100%;
           max-width: 768px;
           border:0px solid #900;
           display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
         }
         .itemlinha30{
           width:100%;
           text-align: left;
         }
         .item50,  .item35, .item67, .item25, .item75, .item768 , article, .call, .imgsatf {
           width:100%;
           padding: 0;
          
        
         }

         .item31  {
           width:100%;
           margin: 0;
           max-width: 768px;

         }
         .item62{
          width:100%;
          margin: 0;
          max-width: 768px;
         }

       
         .item25, .item75 {
           width:100%;
           padding: 0;
           text-align: left;
       
         }
       
         .item35 h2[title="skills"], .item25 h2[title="skills"]  {
           color: #fc9906;
         }

         p, span {width:100%;}
        .linhah{
          border:0px solid #f60;
        }

       h2 { margin: 0 auto;}

        .call, .flutua{
         
         width:100%;
         padding: 0;
         position:relative;
         padding:7px 7px;
         max-width: 768px;
        

        }
        #mobi img { 
          width: 100%; 
           /*height:350px;*/
          -webkit-background-size: cover;
             -moz-background-size: cover;
             -o-background-size: cover;
             background-size: cover;
             border-radius: 0px;
             margin: 0 auto;
             
             
             }
        


        
       }