body{
  box-sizing: border-box;
  margin: 0;
}

.body-container {
    width: 100%;
    margin: auto;
    background-color: black;
    justify-content: center;
    align-items: center;
    display: flex;
    position: relative;
    z-index: 0;
}

.main_container {
  width: 100%;
  height: auto;
  position: relative;

  /* justify-content: center; */


}


.background {
    width: 100%;
    opacity: 0.7;
    height: 100%;
    background-size: 100%;
    background-image: url("image/pattern.png");
    background-repeat: repeat-y;
    position: absolute;
    z-index: 1;
}
.navigator {
  width: 100%;
  height: 150px;
  /* background-color: rgba(0, 122, 204,0.9); */
  background-color: black;
  position:  fixed;
  z-index: 3;
  transition: 0.4s;
  display: flex;
  justify-content:  space-between;
  align-items: center;
  /* text-shadow: 1px 1px 10px black; */

}

.logo {
height: 100%;
width: auto;
margin-left: 15%;



}
.logo a {
  width: auto;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;

}

.logo img {
  height: 80%;
  width: auto;
  /* opacity: 0; */
}





.menu_ li {
  text-decoration: none;
  font-family: 'Roboto', sans-serif;
  list-style: none;
  /* display: flex;
  justify-content: center;
  align-items: center; */
}

ul {
  width: 60%;
  height: 100%;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;

}


.menu_ li {
  height: 100%;
  width: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
}


.menu_ a {
  height: 100%;
  margin: 30px;
  padding: 0;
color: rgb(178, 52, 32);
  display: flex;
  justify-content: center;
  align-items: center;

}


.menu_ a:link {
  /* font-family: "Montserrat" */
  color: rgb(178, 52, 32);
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  letter-spacing: 2.3px;
  font-size: 21px;
  /* text-shadow: 1px 1px 2px rgb(65, 65, 65); */
  /* min-font-size */
  /* color: rgba(0, 122, 204); */
  text-decoration: none;
  transition: 0.4s;

}

.menu_ a:hover {
  font-size: 25px;
  /* color: rgb(9, 176, 181); */
  color: rgb(212, 23, 21);
}

.dropbtn {
  display:  none;
}

/* ///////////////////  foot  ////////////////////////////// */



/* ///////////////////  foot  ////////////////////////////// */

@media screen and (max-width: 1000px ) {
    .logo {
        margin-left:8%;
    }

    .menu_ {
        width:75%;
    }
    .menu_ a {
        margin: 15px;
    }
}


@media screen and (max-width: 768px) {

    .navigator {
        width: 100%;
        height: auto;
        position: relative;
        flex-flow: wrap;
        justify-content: center;
    }

    .logo {
        width: 100%;
        height: auto;
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .logo a {
            width: 60%;
            /* height: 200px; */
        }

        .logo img {
            width: 100%;
            height: auto;
            opacity: 1;
        }



    .menu_ {
        flex-flow: wrap;
        display: none;
    }

        .menu_ li {
            flex-flow: wrap;
        }

        .menu_ li a {
            width: 100%;
            height: 80px;
            
        }

    .dropbtn {
        width: 100%;
        height: 70px;
        background-color: rgba(0, 122, 204,0);
        color: rgb(178, 52, 32);
        border-style: none;
        /* border-color: rgba(0, 122, 204,0.3); */
        display: block;
        font-size: 21px;
        z-index: 2;
    }

    .bhn {
        z-index: 1;
    }

    .show {
        display: flex;
    }


    .bottomcontent {
        flex-flow: wrap;
        justify-content: center;
        align-items: center;
    }


        .bottomcontent h2 {
            font-size: 4.5vw;
            justify-content: center;
            align-items: center;
            text-align: center;
        }

        .bottomcontent a, li {
            font-size: 3.5vw;
            text-align: center;
            justify-content: center;
            align-items: center;
        }

    .footbox {
        width: 100%;
    }


    .copyright p {
        font-size: 1.7vw;
    }
}
