/*Programado por: Gustavo Bayeux Franco*/
/*Importação de fontes */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');
/* Termina importação de fontes */
/*Esse arquivo contém os estilos de todos os elementos da página sobre.php*/

 /* TOPO DA PÁGINA */

  .img_sobre_topo{ /* Estiliza a imagem do topo da página sobre */
    width:52vw;
    z-index:300; 
  }
  #sobre_topo{/*Seção do topo que vai armazenar a imagem e o texto do quem somos*/
   background-size:cover;
   background-repeat: no-repeat, no-repeat;
   background-image:url("../../midia/imagens/fundo_acai.png"),url("../../midia/backgrounds/bg_banner.jpg");
   background-blend-mode:overlay;
   background-position:top;
   background-attachment:fixed;
   padding-top:100px;
   text-align: center;
   padding-bottom:-1px;
  }
  .txt_quem_somos{/*Texto escrito 'QUEM SOMOS' que fica atrás da imagem*/
   background-image: url('../../midia/imagens/efeito_tinta.png');
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
   text-align:center;
   text-align:center;
   font-size:17vw;
   z-index:-1px;
   margin-bottom:-15%;
   color:#f7eeff;
   font-weight:lighter;
   font-family:bebas neue;
  }
 
 /* TERMINA TOPO DA PÁGINA */

 /* Responsividade */
  /* COMEÇA CELULAR PEQUENO*/
  @media only screen and (min-width:100px) and (max-width: 282px) {  
    .txt_quem_somos{/*Texto escrito 'QUEM SOMOS' que fica atrás da imagem*/
        font-size:22vw;
        margin-bottom:-20%;
    }      
    .img_sobre_topo{ /* Estiliza a imagem do topo da página sobre */
        width:76vw;
        z-index:300;
    }
     .titulo_content{
  padding:0px;
  font-family:bebas neue;
  font-size:7vw;
  color:#460333;
  font-weight: lighter;
  line-height: 0.8px;
  background-size:100%;
  z-index:2px;
 }
 .linha_design{
   border-color:#460333;
   border-width: 3px;
   border-style: solid;
   width:10%;
   border-radius: 20px;
   margin-left:-0.2vh;
   margin-top:-2%;
   margin-bottom: 1%;
  }
 .sobre_content{
  color:black !important;
  -webkit-text-stroke-width: 0.1px;
  -webkit-text-stroke-color: rgb(214, 214, 214);
   margin:0px;
   font-family: Open Sans;
   padding:0% 5% 0% 5% ;
   background:linear-gradient(0deg, rgba(255, 255, 255, 0.507), rgba(255, 255, 255, 0.507)), url(../../midia/imagens/acai_transparente.png);
   background-size:contain;
   background-position:bottom;
   
   background-repeat: no-repeat;
 }
 .titulo_content{
  font-size:2rem !important;
 }
 .linha_design{
  width:17% !important;
  border-width:2px !important;
  }
 .sobre_content{
 min-height:300vh !important;
 font-size:1rem !important;

 } 
 .titulo_contato_sobre{
  font-size:3rem !important;

}
#col1{
  display:none;
}    
#col2{
  min-width:100% !important;
  
} 
.titulo_contato_sobre{
  font-size:3.6rem !important;
}
#formulario_contato_sobre input{
width:90px !important;
}
#formulario_contato_sobre textarea{
  width:90px !important;
  }
.contato_sobre{
  margin:0px !important;
  padding:0px !important;
  padding-right:6% !important;
}

  }
  /* TERMINA CELULAR PEQUENO*/
    
  /* COMEÇA CELULAR CONVENCIONAL */  
  @media only screen and (min-width:0px) and (max-width: 330px) {
    .txt_quem_somos{/*Texto escrito 'QUEM SOMOS' que fica atrás da imagem*/
        font-size:23.5vw;
        margin-bottom:-22%;
    }      
    .img_sobre_topo{ /* Estiliza a imagem do topo da página sobre */
        width:86vw;
        z-index:300;
    }
    .titulo_content{
      font-size:2.5rem !important;
      margin-top:15%;
      
    }
    .linha_design{
      width:17% !important;
      border-width:2px !important;
    }
    .sobre_content{
      min-height:65vh !important;
      margin-bottom:-1px !important;
      } 
      #col1{
        display:none;
      }    
      #col2{
        min-width:100% !important;
        
      } 
      .titulo_contato_sobre{
        font-size:3.6rem !important;
      }
      #formulario_contato_sobre input{
      width:90px !important;
      }
      #formulario_contato_sobre textarea{
        width:90px !important;
        }
      .contato_sobre{
        margin:0px !important;
        padding:0px !important;
        padding-right:6% !important;
      }
  }
  /* TERMINA CELULAR CONVENCIONAL */
    
  /* COMEÇA CELULAR MÉDIO */
  @media only screen and (min-width:330px) and (max-width: 590px) {   
    .txt_quem_somos{/*Texto escrito 'QUEM SOMOS' que fica atrás da imagem*/
        font-size:23.8vw;
        margin-bottom:-22%;
    }      
    .img_sobre_topo{ /* Estiliza a imagem do topo da página sobre */
        width:86vw;
        z-index:300;
    }
    .titulo_content{
      font-size:2.5rem !important;
      margin-top:15%;
    }
    .linha_design{
      width:17% !important;
      border-width:2px !important;
    }
    .sobre_content{
      min-height:50vh !important;
      margin-bottom:-1px !important;
      } 
      #col1{
        display:none;
      }    
      #col2{
        min-width:100% !important;
        
      } 
      .titulo_contato_sobre{
        font-size:3.6rem !important;
      }
      #formulario_contato_sobre input{
      width:90px !important;
      }
      #formulario_contato_sobre textarea{
        width:90px !important;
        }
      .contato_sobre{
        margin:0px !important;
        padding:0px !important;
        padding-right:20% !important;
      }
  }
  /* TERMINA CELULAR MÉDIO */
    
  /* COMEÇA CELULAR GRANDE */
  @media only screen and (min-width:590px) and (max-width: 640px) {   
    .txt_quem_somos{/*Texto escrito 'QUEM SOMOS' que fica atrás da imagem*/
        font-size:23.8vw;
        margin-bottom:-22%;
    }      
    .img_sobre_topo{ /* Estiliza a imagem do topo da página sobre */
        width:86vw;
        z-index:300;
    }
    .titulo_content{
      font-size:3rem !important;
      margin-top:10%;
    }
    .linha_design{
      width:17% !important;
      border-width:2px !important;
    }
    .sobre_content{
      min-height:45vh !important;
      } 
      #col1{
        display:none;
      }    
      #col2{
        min-width:100% !important;
        
      } 
      .titulo_contato_sobre{
        font-size:3.6rem !important;
      }
      #formulario_contato_sobre input{
      width:90px !important;
      }
      #formulario_contato_sobre textarea{
        width:90px !important;
        }
      .contato_sobre{
        margin:0px !important;
        padding:0px !important;
        padding-right:16% !important;
      }

  }
  /* TERMINA CELULAR GRANDE */
    
  /*COMEÇA TABLET PEQUENO*/
  @media only screen and (min-width: 640px) and (max-width: 700px) {
    .txt_quem_somos{/*Texto escrito 'QUEM SOMOS' que fica atrás da imagem*/
        font-size:24vw;
        margin-bottom:-23%;
    }      
    .img_sobre_topo{ /* Estiliza a imagem do topo da página sobre */
        width:88vw;
        z-index:300;
    }
    .titulo_content{
      font-size:2.5rem !important;
      margin-top:15%;
    }
    .linha_design{
      width:11% !important;
      border-width:2px !important;
    }
    .sobre_content{
      min-height:40vh !important;
      } 
      #col1{
        display:none;
      }  
      #col2{
        min-width:100% !important;
      }   
  }   
    
  /*TERMINA TABLET PEQUENO*/
      
  /*COMEÇA TABLET CONVENCIONAL*/
    
  @media only screen and (min-width: 700px) and (max-width: 1000px) {
    .txt_quem_somos{/*Texto escrito 'QUEM SOMOS' que fica atrás da imagem*/
        font-size:24vw;
        margin-bottom:-23%;
    }      
    .img_sobre_topo{ /* Estiliza a imagem do topo da página sobre */
        width:88vw;
        z-index:300;
    }
    .sobre_content{
      min-height:40vh !important;
      } 
      #col1{
        display:none;
      }  
      #col2{
        min-width:100% !important;
      } 
      
  }
       
  /*TERMINA TABLET CONVENCIONAL*/
  /*COMEÇA LAPTOP PEQUENO*/
      
  @media only screen and (min-width: 1000px) and (max-width: 1200px) {
    .txt_quem_somos{/*Texto escrito 'QUEM SOMOS' que fica atrás da imagem*/
      font-size:24vw;
      margin-bottom:-23%;
  }      
  .img_sobre_topo{ /* Estiliza a imagem do topo da página sobre */
      width:88vw;
      z-index:300;
  }
  .sobre_content{
    min-height:120vh !important;
    } 
}
/*TERMINA LAPTOP PEQUENO*/
  /* Responsividade */

 /*CONTEÚDO DA PÁGINA*/
 .titulo_content{
  padding:0px;
  font-family:bebas neue;
  font-size:7vw;
  color:#460333;
  font-weight: lighter;
  line-height: 0.8px;
  background-size:100%;
  z-index:2px;
 }
 .linha_design{
   border-color:#460333;
   border-width: 3px;
   border-style: solid;
   width:10%;
   border-radius: 20px;
   margin-left:-0.2vh;
   margin-top:-2%;
   margin-bottom: 1%;
  }
 .sobre_content{
   line-height:1.6em;
   font-size:1.1rem;
  color:black !important;
  -webkit-text-stroke-width: 0.1px;
  -webkit-text-stroke-color: rgb(214, 214, 214);
   margin:0px;
   font-family: Open Sans;
   padding:0% 15% 0% 5% ;
   background:url(../../midia/backgrounds/Background_transicao_sobre.jpg);
   background-size:100%;
   background-position:bottom;
   background-repeat: no-repeat;
   min-height:100vh;
   
 }
 .contato_sobre{
  padding:0% 15% 0% 5% ;
  background:url(../../midia/backgrounds/Backgorund_transicao_sobre2.jpg);
  background-size:100%;
  background-position:top;
  background-color:#460333;
  background-repeat: no-repeat;
  min-height:100vh;
 }
 .titulo_contato_sobre{
  margin:0px;
  background:none;
  text-align:center;

  font-size:5rem;
  font-family: bebas neue; 
  color:white;
  font-weight:100;
  text-shadow:0px 0px 15px black;
}

 /* FORMULÁRIO DE CONTATO */

  #formulario_contato_sobre{
    float:right;
    text-align: center;  
    padding:1%;
   
  }
  #formulario_contato_sobre input[type=text],#formulario_contato_sobre input[type=tel]{
    border:none;
    border-bottom:2px solid rgb(214, 65, 177);
    color:white;
    background:transparent;
    outline:none;
    font-size:1.4rem;
    font-family: open sans;
    min-width:200px;
    padding:5px;
    font-weight: lighter;
    transition:0.5s;
  }
  #formulario_contato_sobre input[type=text]:focus,#formulario_contato_sobre input[type=tel]:focus{
    border:none;
    border-bottom:3px solid rgb(255, 1, 191);
    color:white;
    background:rgba(255, 1, 192, 0.473);
    outline:none;
    font-size:1.4rem;
    transition:0.5s;
    border-radius: 12px 12px 0px  0px ;
    font-family: open sans;
    min-width:200px;
    padding:5px;
    font-weight: lighter;
  }
  #formulario_contato_sobre input::placeholder{
    color:white;
    
  }
  #formulario_contato_sobre textarea{
    outline:none;
    color:rgb(255, 255, 255);
    min-width:192px;
    padding:5px;
    font-size:1.4rem;
    border-width: 2px;
    font-family: open sans;
    border-radius: 5px;
    border-color: rgb(214, 65, 177);
    background:rgba(0, 0, 0, 0);
    text-align:center;
  }
  #formulario_contato_sobre textarea::placeholder{
    color:rgb(223, 223, 223);
    text-align:center;
    font-size:1rem;
  }
  #formulario_contato_sobre button{
    background:transparent;
    border:none;
    border:2px solid;
    border-radius:30px;
    padding:6px 12px 6px 12px;
    color:white;
    border-color: rgb(214, 65, 177);
    transition:0.5s;
    font-size:1.4rem;
  }
  #formulario_contato_sobre button:hover{
    background:rgb(214, 65, 177);
    color:white;
    border-color: rgb(214, 65, 177);
    transition:0.5s;
    padding:6px 18px 6px 19px;
    box-shadow: 0px 0px 20px rgb(214, 65, 177) ;
    font-size:2rem;
    outline:none;
    font-weight: lighter;
  }
 /* FORMULÁRIO DE CONTATO */
  #col1{
    float:left;
  }
  #col2{
    float:right;
    min-width:50%;
  }

  .info_box{
    text-align:center;
    color:white;
    font-family:open sans;
    padding:5%;
    width:220px;
    height:150px;
    border:4px solid white;
    transition: 0.5s;
  }
  .info_box:hover{
    text-align:center;
    color:white;
    font-family:open sans;
    padding:5%;
    width:220px;
    height:150px;
    border:4px solid white;
    box-shadow:0px 0px 20px,inset 0px 0px 20px;
    transition:0.5s;
    cursor: url("../cursors/hover.png"), auto !important;
  }
  
  .info_box i{
    font-size:3rem;
    
  }
 /*CONTEÚDO DA PÁGINA*/


/*Esse arquivo contém os estilos de todos os elementos da página sobre.php*/