*{

    box-sizing: border-box;

    margin:0;

}

body{
  background-image: url('images/background.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  font-family: 'Ubuntu', sans-serif;
}

::-webkit-scrollbar {
    width: 2px;
  }
  

  ::-webkit-scrollbar-track {
    background: white;
  }
  

  ::-webkit-scrollbar-thumb {
    background: rgba(116, 90, 66, 0.8);
  }
  

  ::-webkit-scrollbar-thumb:hover {
    background: rgba(82, 65, 50, 0.8);
  }

  .arrow {
    border: solid white;
    border-width: 0 6px 6px 0;
    display: inline-block;
    padding: 5px;
    margin-left:10px;
  }

  .down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
  }


.header{
  background: white;
  background-image:linear-gradient(rgb(0,0,0,0.4),rgb(0,0,0,0.4)), url('images/hbackground.jpg');
    width:100%;

    top:0;


    display:flex;
    justify-content: center;
    align-items:center;
    flex-direction: row;
    border:15px;

    

}
.gldiv{
  width: 40%;
  height:40%;
  background-color:rgb(150, 116, 84);
  display:flex;
  justify-content: center;
  align-items: center;
  padding:2.5%;
  border-radius:15px;
  margin-bottom:3%;
}

.d2{
  margin-left:15%;
}


/* .center{
    display:flex;
    justify-content: center;
    align-items:center;
    flex-direction: center;
    margin:0 20%;

} */

body{
  display:flex;

    align-items: center;
    flex-direction:column;
}

a{
  display:flex;
    align-items: left;
    justify-content:left;
}

a img{
  background-color:rgb(255, 255, 255,0.4);
  border-radius:10px;
  padding:2%;
    width:80%;

    height:80%;

    left:0;

    margin-top:2%;
    margin-bottom:2%;

}



.all{

    margin-top:10%;
    margin-bottom:10%;
    width:80%;

    background-color: rgba(116, 90, 66, 0.8);

    display:flex;

    align-items: center;

    flex-direction:column;

    padding:3%;

    color:white;

}

.rad{
  display:flex;
}
.odv{
    display:flex;
    justify-content: center;
    align-items: center;
    flex-direction:column;
    background-color:rgb(146, 116, 84);
    padding:4%;
    border-radius:30px;
    border:solid 3px rgb(99, 86, 72);
    transition:all 0.2s ease-in;
    margin-bottom:5%;
}
h2{
    transition:all 0.2s ease-in;
}
.odv:hover h2{
  animation-name: anim1;
  animation-duration: 0.5s;
    box-shadow: 3px 3px 8px 8px white;
    cursor:default;
    border-radius:7.5px;
}

/* .container{

    background-color: gray;

    display:flex;

    justify-content: center;

    align-items: center;

    padding:3%;

} */


input{

    margin:2%;

    border-radius:10px;

    display:flex;

    justify-content: center;

    align-items: center;

    padding:5%;

}

textarea{

  margin:2%;

  border-radius:10px;

}

.all a{
  text-transform: uppercase;
  text-decoration: none;
  color:white;
  padding:2%;
  margin:1%;
  background-color:rgb(146, 116, 84);
  border-radius:10px;
  text-align:center;
  display:flex;
  align-items:center;
  justify-content: center;
  width:150%;
}

.all a:hover{
  text-decoration:underline;
  background-color:rgb(104, 84, 63);
}

li{
  font-size:220%;
}

li a{
  font-size:22px;
}

.all select{
  margin:2%;

    border-radius:10px;

    display:flex;

    justify-content: center;

    align-items: center;

    padding:5%;
}

label{

    color:white;

}

button{

  background-color:rgb(104, 84, 63);
    padding:5%;
    cursor:pointer;
    color:white;
    font-weight:bold;
    transition:all 0.15s ease-in;

}

button:hover{

    color:rgb(104, 84, 63);
    background-color:white;

}

h1{
  color:white;
}

.dropdown {
    display:flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-weight: bold;
    border-radius:10px;
    background-color: rgb(146, 116, 84);
    color:white;
    padding: 0.75%;
    cursor:pointer;
    margin: 0 1%;
  }
  @keyframes anim1 {
    from {filter: blur(5px);}
    to {filter: blur(0px);}
  }

  @media only screen and (max-device-width: 480px) {
    .header{
      flex-direction:column;
      padding:2%;
    }
    a img{
      width:60%;
      height:60%;
    }
    .odv{
      font-size:13px;
    }
    h1{
      margin-top:2%;
      margin-bottom:2%;
    }
    a{
        align-items: center;
        justify-content:center;
    }
    .odv:hover h2{
        box-shadow: 1px 1px 3px 3px white;
    }
  }

  @media only screen and (max-device-width: 870px) {
    h1{
      font-size:25px;
    }
    .odv:hover h2{
      box-shadow: 2px 2px 6px 6px white;
    }
  }
  

  /* .dropdown .dropbtn {
      text-align: center;

      font-size: 18px;

      font-weight: bold;

      color:white;

      padding: 12px;

      cursor:pointer;

  }

  

  .dropdown-content {

    margin-top:10%;
    display:none;

    position: absolute;

    background-color: rgb(146, 116, 84);

    min-width: 250px;

    z-index: 5;

  }

  

  .dropdown-content option {

    float: none;

    color: white;

    padding: 12px 16px;

    text-decoration: none;

    display: block;

    text-align: left;
    transition:all 0.2s ease-in;

  }

  

  .dropdown-content option:hover {

    color: black;
    background-color:white;

    cursor:pointer;

  }

  

  .dropdown:hover .dropdown-content {

    display: block;

  } */