body{
   /* background-image: url(IMAGENS/fundoverde.webp);*/
   background-color:#F0F2DF;

    font-size:16px;
}

#banner{    
margin: auto;
max-width:300px;
}

#barra{
margin-top: 5px;
}
#img{
border-radius: 10px;  

}


h3{
    color: white;
    font-size: 1em;
}
h2{
    margin-top: 30px;
    margin-bottom: 10px;
    color: #075f2c;
}
#carouselExampleInterval{
    width:355px;
    margin:auto;
    
}
h4{
    color: white;
    font-size: 20px;
    padding-top: 25px;
}

#dev{
    margin: auto;
     text-align: center;
    color: white;
    font-size: 1em;
    
}
#dev:hover{
    background-image: linear-gradient(90deg, #229150, #229150, #229150);
    border-radius: 5px;
}

#menu{
    background-image: linear-gradient(90deg, #075f2c, #075f2c, #075f2c);
    text-decoration: none;
    font-size: 14px;
    color: white;
    margin-bottom: 25px;
    
}
    .btn-social{
        background-color:#01450f;
        border:none;
        margin-top: 25px;
        width: 340px;
    }
.logo-rede-social{
    width: 25px;
}


#div{
padding-right: 0;
padding-left: 0;

}
#div2{
    padding-left: 8px;

}


#profissional{
    margin: auto;
    margin-top: 25px;
    padding-bottom: 9px;
    border-radius: 10px;      
}
#data{
    background-color: #e0dbdb00;
    margin-bottom: 10px;
   
}
p{
    color: #0D0D0D;
    font-size: 0.8em;
}
#legenda3{
margin-right: 20px;

}
#confirmar{
    margin-bottom: 10px;
}


a{
     text-align: center;
text-decoration-color: none;
color: white;
}
a:hover{
font-size: 16px;
color: white;
}
#links{
margin: auto;
padding-bottom: 10px;
}
#mudar{
    background-image: linear-gradient(90deg, #075f2c, #569b73, #075f2c);
    color: white;
    width: 200px;
    border-radius: 5px;
    margin-bottom: 20px;
      
}

#button{
    background-image: linear-gradient(90deg, #075f2c, #569b73, #075f2c);
    box-shadow: 1px 2px 2px #757575;
    color: white;
    width: 300px;
    height: 38px;
    border:none;
    margin-top: 10px;
    border-radius: 5px;
    margin-bottom: 5px;
    padding-bottom: 2px;

}
#button:hover{
    border-color: #075f2c;
}
#buttonadd{
    background-image: linear-gradient(90deg, #075f2c, #569b73, #075f2c);
    border: none;
    color: white;
   width: 250px;
height: 32px;
    margin-top: 25px;
    border-radius: 5px;
    margin-bottom: 10px;

}
#buttonadd:hover{
    border-color: #279755;
}
footer{
    background-image: linear-gradient(90deg, #075f2c, #075f2c, #075f2c);
    margin-top: 25%;
    padding-top: 10px;
    padding-bottom: 5px;
    
  }
 
  h1{ 
    width: 150px;
    font-size: 16px;
    margin: auto;
    font-family: 'Roboto', sans-serif;
 

}
h1:hover{

}
#carouselExampleCaptions{
    max-width: 800px;
    margin: auto;
    margin-bottom: 50px;
}
#carrocel{
    max-width: 800px;
    margin: auto;
    border-radius:10px;
  
}

 #h1{
padding-top: 0px;
padding-bottom: 165px;
background-image: url(IMAGENS/raquete.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;

}
#logobm{
width:20px;
}
#logo{
 margin: auto;
 margin-top: 100px;
margin-bottom: 50px;
max-width: 250px;
}

#name{
margin: auto;
width: 200px;

}
#name:hover{
    border-color: #075f2c;
}

#no-spin:hover{
   border-color: #075f2c;
}
#escolha{
  font-family: 'Roboto', sans-serif;

 margin-bottom: 0px;   

}


input[type="date"] {
background-color: #e0dbdb00;
border-radius: 5px;
                                              
margin-bottom: 20px;
box-shadow: 1px 2px 2px #757575;
width: 186px;
text-align: center;
}


    input[type="date"]::-webkit-calendar-picker-indicator {
        cursor: pointer;

        margin-right: 10px;
        margin-left: 0px;
        color: #075f2c;
        filter: invert(1) brightness(50%) sepia(100%) saturate(10000%) hue-rotate(200deg);
    }

    input[type="date"]:before {
    color: transparent;
    background: none;
    display: block;
    font-family: 'FontAwesome';
    content: '\f073';
    width: 15px;
    height: 20px;
    position: absolute;
    top: 7px;
    right: 6px;
   }

#no-spin{
    text-align: center;
    border-radius: 5px;
    width: 300px;
    margin:auto;  
    background-color: white;
    color: black;
    margin-top:10px;  
    margin-bottom: 10px;
  
            
    
    }
    table{
    width:100%;
    max-width:800px;
    border-radius: 5px;
    margin: auto;
    background-color: #075f2c;
    font-size: 0.8em;
}
#container_data{
    
          border-radius: 10px;
          border-top-right-radius: 0;
          border-top-left-radius: 0;
          border-bottom-right-radius: 0;
          margin: auto;
          background-color: #14351c;
          width:350px;
           padding-top: 10px;
          padding-bottom:30px;
    
}
#outraData{
    background-image: linear-gradient(90deg, #1f7a35, #3f9655, #1f7a35);
   margin-bottom:10px;
   font-size:16px;
   border: solid  #1f7a35 ;
}

a:hover{
     background-color: #c4ebce;
     color: black;
}
#barbeiro{
    background-color: white;
    color: black;
          border-radius: 5px;
      margin: auto;
      width: 250px;
      text-align: center;
      margin-bottom: 10px;
      height: 33.2px;
    }
    #container_barbeiros{
        
            border-radius: 10px;
            width:350px;
            border-top-right-radius: 0;
            border-top-left-radius: 0;
            border-bottom-right-radius: 0;
    
        margin: auto;
        background-color: #14351c;
        padding-top: 10px;
        padding-bottom: 15px;
    
    }
    #container_barbeiros_input{
        
            border-radius: 10px;
            border-top-right-radius: 0;
            border-top-left-radius: 0;
            border-bottom-right-radius: 0;
        margin: auto;
        background-color: #14351c;
        width: 350px;
        padding-top: 0;
        padding-bottom: 15px
    
    }
    #container_servico{
text-align: center;
            border-radius: 10px;
            border-top-right-radius: 0;
            border-top-left-radius: 0;
            border-bottom-right-radius: 0;
        margin: auto;
        background-color: #14351c;;
        width: 350px;
        padding-top: 10px;
        padding-bottom: 15px
    
    }
    #servico{
        background-color: black;
        color: white;
          border-radius: 5px;
          margin: auto;
          margin-top:25px;
          width: 250px;
          text-align: center;
          margin-bottom: 10px;
          height: 33.2px;
      
      
          }
          .checkbox-label {
              margin:auto;
            text-align: center;
            display: inline-block;
            margin-right: 10px;
            margin-bottom: 10px;
          }
          
          .checkbox-label input[type="checkbox"] {
            display: none;
          }
          
          .checkbox-button {
            display: inline-block;
            padding: 8px 16px;
            background-color: #1f7a35;
            color:white;
            border-radius: 4px;
            cursor: pointer;
          }

          
          .checkbox-label input[type="checkbox"]:checked + .checkbox-button {
            background-color: white;
            color: #1f7a35 ;
          }

          #horario2{
            background-color: white;
            color: black;
            margin: auto;
            width: 250px;
            border-radius: 5px;
          text-align: center;
          margin-bottom: 10px;
          height: 33.2px;
          }
          #telefone{
            background-color: white;
            color: black;
            margin: auto;
            width: 250px;
            height: 33.2px;
            border-radius: 5px;
          text-align: center;
          margin-bottom: 20px;
      
          }
          #nome{
            background-color: white;
            color: black;
              margin: auto;
              margin-bottom: 10px;
              text-align: center;
              width: 250px;
              height: 33.2px;
          }
          #container_name_tel{
      
            border-radius: 10px;
            border-top-right-radius: 0;
            border-top-left-radius: 0;
            border-bottom-right-radius: 0;
            margin: auto;
            margin-top:0;
            margin-bottom:25px;
            background-color: rgb(46, 46, 46);;
            width:350px;
            padding-top:25px;
            padding-bottom: 10px;
            color: white;
           
    }
    h5{
        font-size:25px;
        font-family: 'Carnivalee Freakshow', sans-serif;
        background-image: linear-gradient(90deg, #000000, #1d1d1d, #000000);
        width:350px;
        border: 2px;
        border-top-right-radius: 10px;
          
            border-top-left-radius: 0;
            border-bottom-right-radius: 0;
        color: rgb(255, 255, 255);
        text-align: center;
        margin:auto;
        margin-top:30px;
    }

     #button:hover{
         background-image: linear-gradient(90deg, #4c885b, #4c885b, #4c885b);
       
     }
     #buttonadd{
         margin:auto;
        background-image: linear-gradient(90deg, #1f7a35, #3f9655, #1f7a35);
        color: rgb(255, 255, 255);
        border-radius: 5px;
        margin-top:10px;
        margin-bottom:10px;
        width: 250px;
        height: 33.2px;
        justify-content: center;
     }
     #titulo{
        font-size:25px;
        font-family: 'Carnivalee Freakshow', sans-serif;
        width:350px;
        border: 2px;

        color: rgb(255, 255, 255);
        text-align: center;
        margin:auto;
        margin-top:30px;
     }

    #label{
       
       background-image: linear-gradient(90deg, #01450f, #01450f, #01450f);
       font-family: 'Noto Serif Tamil', serif;
       font-size:16px;
       width:355px;
       height:41;
       border-top-right-radius: 10px;
       border-top-left-radius: 10px;
       border-bottom-right-radius: 0;
       color: rgb(255, 255, 255);
       text-align: center;
       margin:auto;
       margin-top:25px;
       margin-bottom:0;
       padding-top:5px;
       padding-bottom:5px;
       animation: grow 0.3s ease-in-out;
       box-shadow: 1px 2px 1px #757575;
                }
          #container_card{
 
             border-radius: 10px;
             border-top-right-radius: 0;
             border-top-left-radius: 0;
             margin: auto;
             margin-bottom:15px;
             background-color: #B5BF6B;
             width:355px;
         
              padding-top: 15px;
             padding-bottom:30px;
         animation: grow 0.3s ease-in-out;
          }
       
    .minha-classe{
  background-color: #14351c; /* Defina a cor que você deseja aqui */

  color: white;
  border: none;
    }
        #logorodape{
        width:25px;
            
        }
        
    .minha-classe:hover{
        background-color: #468054;
    }
    #container_escolhidos{
        background-color: #d6d6d6c4;
         border-radius: 10px;
        width:350px;
        margin:auto;
        font-size: 20px;
        text-align: center;
        
      }
.foto-topo{
    padding-top: 0px;
padding-bottom: 40px;
background-image: url(IMAGENS/raquete.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;

}