*{
         margin: 0;
         padding: 0;
         box-sizing: border-box;   
        }
        body{
        background-color:cornsilk;
        font-family: Verdana, Geneva, Tahoma, sans-serif;    
        }
        header nav{
        display: flex;
        background-color: orange;
        align-items: center;
        justify-content: space-between;
        height: 50px;
        padding: 5px;
        top: 0;
        right: 0;
        position: fixed;
        left: 0;
        z-index: 1000;   
        }
        nav ul{
        list-style: none;
        display: flex;
        gap: 15px;    
        }
        nav ul li a{
        text-decoration: none;
        color: white;
        font-weight: bold;

        }
        nav ul li a:hover{
        color:wheat;
        cursor: pointer; 
        }
        .logo{
        color: white;
        font-weight: bolder;
        font-size: large;
        }
        span{
         color: orange;   
        }
        header h1{
        padding:10px ; 
        margin-top: 60px;   
        }
        main{
        padding: 10px;  
        }
        .main-button{
        padding-top: 10px;    
        }
        .main-button button{   
         background-color: orange;
         border:white solid;
         color: white;
         font-weight: 500;
         padding: 5px;
         border-radius: 5px;
        }
        .main-button button:hover{
        background-color: rgb(236, 188, 56);
        cursor: pointer;    
        }
        #contact-button{
        color: orange;
        font-weight: bold;
        background: none;
        border:1px orange solid;    
        }
        #contact-button:hover{
        background-color: rgb(243, 229, 190);
        cursor: pointer;    
        }
        .navbar{
        list-style: none;
        display: flex;
        gap: 20px;    
        }
        .hamburger{
        display: none;
        flex-direction: column;
        cursor: pointer;
        gap: 5px;    
        }
        .hamburger span{
         width: 25px;
         height: 3px;
         background-color: white;
         border-radius: 2px;   
        }
        .main-intro{
           display: grid; 
           grid-template-columns: 1fr 1fr;
           align-items: center;
           height: 100vh;
           padding: 30px;
           gap: 20px;
          }
         .main-infor p{
          line-height: 1.6;
         } 
         .main-infor{
         max-width: 600px;   
         } 
         .main-infor h1{
         font-size:50px;
         margin-bottom: 10px;   
         }
         .intro-picture img{
         width: 100%;
         height: auto;
         border-radius: 10px;
         object-fit: cover;   
         }
         .hidden{
          display: none;   
         }
        @media(max-width:768px){
           .navbar{
           position:absolute; 
           top: 60px;
           right: 0;
           background: orange;
           width: 90px;
           height: auto;
           flex-direction: column;
           text-align: right;
           padding: 17px;
           display: none;

           } 
          .hamburger{
           display: flex; 
          }
       
          .navbar.show{
          display: flex;   
          }
          .main-intro{
          display:grid;
          grid-template-columns: 1fr;
          text-align: center;
          height:auto;
          }
       
        .intro-picture img{
           width: 90%;
           margin: 0 auto;
          }
        }
        footer{
         background-color: orange; 
         height: 50px;
         font-size: large; 
         font-weight: bold; 
         align-items: center;
         bottom: 0;
         position: fixed;
         right: 0;
         left: 0;
         z-index: 1000;
        }
        footer small{
        color: white;
        text-align: center;
        align-items: center;    
        }