*{padding:0;margin:0}
html{
    scroll-behavior: smooth;
    text-shadow: 2px 2px 4px #000000;
    }
a:hover{
    color:orange;
}
body{
    color:white;
    background-image: url("bg.jpeg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}

nav {
    background-color: white;
    text-shadow:none;
    display: flex;
    justify-content: space-between;
    padding: 1rem 2rem;
    width: auto;
  }
nav a{
    color:#191919;
    text-decoration:none;
    margin-left:20px;
}
 nav ul {
  	display: flex;
      list-style: none;
      gap: 2rem;
      align-items: center;
 }
  
nav div img {
	width: 50px;
}
nav div h1 {
    text-align:center;
    margin-top:15px;
    color: #191919;
    margin-bottom:15px;
}
  nav ul li a {
  	text-decoration: none;
      font-family: "Segoe UI", sans-serif;
      color: #191919;
      font-weight: 600;
      padding: 8px 0;
      transition-duration: 300ms;
      border-bottom: 1px rgba(256, 68, 0, 0);
  }
  
nav ul li a:hover {
	color: orangered;
	border-bottom: 1px solid orangered;
}
.image-1 img {
	height: 300px;
    width:auto;
}
.flipimg-2 img{
	height: 300px;
    width:auto;
}
.flip-box {
  background-color: transparent;
  margin:auto;
  width: auto;
  height:300px;;
  border: transparent;
  padding-top:50px;
  padding-bottom:50px;
  perspective: auto;
  display: flex;
  justify-content:center; 
}

.flip-box-inner {
    text-align:center;
    align-items:center;
    justify-content:center;
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

.flip-box:hover .flip-box-inner {
  transform: rotateY(180deg);
}

.flip-box-front, .flip-box-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-box-front {
  background-color: transparent;
  color: black;
}

.flip-box-back {
  background-color: transparent;
  color: white;
  transform: rotateY(180deg);
}
#three h5{
    text-align:center;
    display:flex;
    text-indent:65px;
    justify-content:center;
    /* align-items:baseline; */
    text-align:center;
    
}
#fourth {
    text-decoration:none;
}
#home {
    font-size:20px;
}
.top-middle-1{
    border:5px solid rgb(86, 123, 158);
    width:350px;
    float:left;
    margin: 0px 0px 0px 50px;
    align-items:center;
    justify-content:center;
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
}

.top-middle-1 img{
    width:100px;
    height:100px;
    float:none;
    margin: 0px 0px 0px 0px;
   align-items:center; 
   justify-content:center;
    display:flex;
}
.top-middle-2 img{
    width:100px;
    height:100px;
    float:none;
    margin: 0px 0px 0px 0px;
   align-items:center; 
   justify-content:center;
    display:flex;
}
h5{
    font-size: 30px;
    text-align:center;
    text-transform: capitalize;
    text-decoration: underline;
    font-weight:bold;
}
#fourth{
    font-size: 30px;
    text-indent:10px;
    text-align:center;
    text-transform: capitalize;
    text-decoration: underline;
    font-weight:bold;
    margin-top:80px;
}
.top-middle-1 h2{
    margin:15px;
    font-size:20px;
    text-transform:uppercase;
    text-align:center;
}
.top-middle-2{
    border:5px solid rgb(86, 123, 158);
    width:350px;
    float:right;
    margin: 0px 50px 0px 50px;
    align-items:center;
    justify-content:center;
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    
}
.top-middle-2 h2{
    margin:15px;
    font-size:20px;
    text-transform:uppercase;
    text-align:center;
    display:flex;
    justify-content:center;
    align-items:baseline;
}

.third{
    width:auto;
    font-size:12px;
    margin-top: 215px;
    height:autopx;
    display:flex;
    justify-content:center;
    /* align-items:baseline; */
    text-align:center;
}
.side-1{
    border:5px solid rgb(86, 123, 158);
    width: 230px;
    margin: 0px 0px 0px 0px;
    float:left;
    text-transform:capitalize;
    display:flexbox;
}
.side-1 img{
    width:100px;
    height:100px;
}
.side-2{
    border:5px solid rgb(86, 123, 158);
    width:230px;
    margin: 0px 0px 0px 15px;
    float:left;
    text-transform:capitalize;
    text-align:center;
    display:flexbox;
    justify-content:center;
    align-items:baseline;
}
.side-2 img{
    width:100px;
    height:100px;
}
.side-3{
    border:5px solid rgb(86, 123, 158);
    width:230px;
    margin: 0px 0px 0px 15px;
    float:left;
    text-transform:capitalize;
    text-align:center;
    display:flexbox;
    justify-content:center;
    align-items:baseline;
}
.side-3 img{
    width:100px;
    height:100px;
}
.side-4{
    border:5px solid rgb(86, 123, 158);
    width:230px;
    margin: 0px 0px 0px 15px;
    float:left;
    text-transform:capitalize;
    text-align:center;
    display:flexbox;
    justify-content:center;
    align-items:baseline;
}
.side-4 img{
    width: 67px;
    height:100px;
}
.side-5{
    border:5px solid rgb(86, 123, 158);
    width:230px;
    margin: 0px 0px 0px 15px;
    float:left;
    text-transform:capitalize;
    text-align:center;
    display:flexbox;
    justify-content:center;
    align-items:baseline;
}
.side-5 img{
    width:100px;
    height:100px;
}
.side-6{
    border:5px solid rgb(86, 123, 158);
    width:230px;
    margin: 0px 0px 0px 15px;
    float:leftbox;
    text-transform:capitalize;
    text-align:center;
    display:flexbox;
    justify-content:center;
    align-items:baseline;
}
.side-6 img{
    width:100px;
    height:100px;
}
.fourth{
    margin-top: 85px;
    text-align:center;
    font-size:12px;
    width:auto;
    height:150px;
    display:flex;
    justify-content:center;
    align-items:baseline;
}
.side-7{
    border:5px solid rgb(86, 123, 158);
    width:230px;
    margin: 0px 0px 0px 15px;
    float:left;
    text-transform:capitalize;
    text-align:center;
    display:flexbox;
    justify-content:center;
    align-items:baseline;
}
.side-7 img{
    width:100px;
    height:100px;
}
.side-8{
    border:5px solid rgb(86, 123, 158);
    width:230px;
    margin: 0px 0px 0px 15px;
    float:left;
    text-transform:capitalize;
    text-align:center;
    display:flexbox;
    justify-content:center;
    align-items:baseline;
}
.side-8 img{
    width:100px;
    height:100px;
}
.side-9{
    border:5px solid rgb(86, 123, 158);
    width:230px;
    margin: 0px 0px 0px 15px;
    float:left;
    text-transform:capitalize;
    text-align:center;
    display:flexbox;
    justify-content:center;
    align-items:baseline;
}
.side-9 img{
    width:100px;
    height:100px;
}
.side-10{
    border:5px solid rgb(86, 123, 158);
    margin: 0px 0px 0px 15px;
    padding-left:30px;
    float:left;
    font-size:13.755px;
    width:600px;
    height:auto;
    text-transform:capitalize;
    text-align:left;
    display:flexbox;
    align-items:baseline;
}
.side-10 img{
    width:100px;
    height:100px;
}
.fifth{
    font-family:Georgia, 'Times New Roman', Times, serif;
    margin-top: 20px;
    padding-left:20px;
    margin-bottom:50px;
    height:auto;
    display:flex;
    justify-content:left;
    justify-content:center;
    /* align-items:baseline; */
}
.side-11{
    border:5px solid rgb(86, 123, 158);
    padding-left:20px;
    font-size: 28px;
    width:2000px;
    text-shadow: 2px 2px 4px #000000;
    height:auto;
    display:flex;
    justify-content:left;
    margin: 0px 0px 0px 15px;
    float:right;
    text-align:left;
    display:flexbox;
    align-items:baseline;
}