body {
  margin: 0;
  padding: 0;
}

.content {
  width: 85%;
  /* border: 1px solid green; */
  position: relative;
  top: 9%;
  display: flex;
  margin-left: 8%;
}
/* .head{
  width: 100%;
  height: 10vh;
  border: 1px solid red;
  padding-left: 30px;
  background: linear-gradient(to right, rgb(17, 17, 17), rgb(133, 5, 126), rgb(133, 5, 126), rgb(252, 248, 4));
  color: white;
} */

.bod {
  width: 100%;
  margin-top: 60px;
  /* border: 1px solid blue; */
}
/* .bod h2 {
  padding: 10px 10px;
 
} */

.flex-card {
  display: flex;
  margin: 0 auto;
  padding: 30px;
}

.flex {
  flex: 1;
  height: 400px;
  border: 10px solid black;
}


.bod .container{
  display: flex;
  justify-content: space-between;
  height: 450px;
  /* border: 1px solid rgb(78, 240, 240); */
  box-shadow: 8px 5px 8px rgb(94, 93, 93);
  border-radius: 12px;
}
.top2 .container img{
  width: 20%;
  height: 10%;
  border-radius: 12px;
  /* margin-top: 8%; */
}

.top2 .container .img img {
  width: 100%;
  height: 95%;
}
.container .writeup{
  margin-left: 30px;
  margin-top: 5%;
  border-right: 1px solid grey;
  margin-right: 10px;
  padding-left: 10px;
  height: 80%;
  color: black;
}
.container .side{
  /* margin-left: -30%; */
  margin-top: 5%;
  text-align: center;
  color: black;
}
.bod h2{
  padding-top: 30px;
  text-align: center;
  color: black;
}

.writeup .view{
  margin-top: 20%;
  background-color: blue;
  padding: 8px;
  border-radius: 10px;
  color: white;
  text-decoration: none;
}
.writeup a{
  background-color: black;
  padding: 8px;
  border-radius: 10px;
  color: white;
  text-decoration: none;
}
.top2{
  margin-top: 5%;
}
.bod .top img, .bod .top2 img{
margin-top: 15px;
}

hr {
width: 95%;
}

p {
padding-right: 10px;
}

.bod2 h2{
text-align: center;
color: white;
margin-top: 80px;
}
footer{
padding: 10px;
color: rgb(72, 179, 179);
text-align: center;
padding-top: 30px;
}

@media all and (min-width: 992px) {
.dropdown-menu li{ position: relative;}
.nav-item .submenu{ 
  display: none;
  position: absolute;
  left:100%; top:-7px;
}
.nav-item .submenu-left{ 
  right:100%; left:auto;
}
.dropdown-menu > li:hover{ background-color: #f1f1f1 }
.dropdown-menu > li:hover > .submenu{ display: block; }
}	
/* ============ desktop view .end// ============ */

/* ============ small devices ============ */
@media (max-width: 991px) {
.dropdown-menu .dropdown-menu{
    margin-left:0.7rem; margin-right:0.7rem; margin-bottom: .5rem;
}
}	